How To Setup Tech Pro Blogger Template [TemplatesYard]
Tech Pro is a magazine blogger template for tech and mews blogs, loaded with tons of widgets it has the capability to match any wordpress site design professionally. Tech Pro is equipped with various of widgets which will help you to publish your blog more professionally. To make it easy for you we have published this detailed documentation, so that you can setup your blog correctly. You have made a good decision by choosing our template.
You can check the live demo or download the template through the button below and also Please Read this documentation carefully in order to set up your blog and please note that there’s no support for free users.
You can check the live demo or download the template through the button below and also Please Read this documentation carefully in order to set up your blog and please note that there’s no support for free users.
Video Documentation
You can check this below video to understand the setup process much more easily, just click the below image to watch the video directly on YouTube, or click this link - How To Setup Jasmine Blogger Template - Way2Themes
Top Navigation
Access your blog Layout > click Edit link on Top Navigation widget.Social Top Widget/Social Footer Widget
Access your blog Layout > click Edit link on Social Top widget.Icons Available { facebook, twitter, gplus, rss, youtube, skype, stumbleupon, tumblr, vine, stack-overflow, linkedin, dribbble, soundcloud, behance, digg, instagram, pinterest, delicious, codepen}
Main Menu/ DropDown/ Multi DropDown
Access your blog Layout > click Edit link on Main Menu widget.
Normal Link : Features
Sub Link: _Sub Link 1.0 (before the link add "_") 1 underscore
Sub Link 2: __Sub Link 1.1 (before the link add "__") 2 underscore
Sub Link 2: __Sub Link 1.1 (before the link add "__") 2 underscore
Ticker News
Access your blog Layout > click Add a Gadget > HTML/JavaScript on Ticker News Section, and then add one of the following- Recent Posts: <span data-type="recent" data-no="5"></span>
- Label / Tag Ex: <span data-type="label" data-label="Sports" data-no="5"></span>
Slider Widget
Access your blog Layout > click Add a Gadget > HTML/JavaScript on Featured Posts Section, and then add one of the following.
- Recent Posts: <span data-type="ty-latest-slide" data-no="6"></span>
- Label / Tag Ex: <span data-type="ty-tag-slide" data-label="Sports" data-no="6"></span>
Main Featured Post
Access your blog Layout > click Add a Gadget > HTML/JavaScript on Featured Posts Section, and then add one of the following.
- Recent Posts: <span data-type="tyard-recent"></span>
- Label / Tag Ex: <span data-type="tyard-label" data-label="Sports"></span>
Featured Summary
Access your blog Layout > click Add a Gadget > HTML/JavaScript on Featured Posts Section, and then add one of the following.
- tysum: <span data-type="tysum" data-label="Video" data-no="3"></span>
Content Featured Widgets
Access your blog Layout > click Add a Gadget > HTML/JavaScript on Box Layout / Box Layout 2 / Gallery Section, and add the type of the desired boxTypes : { tybox, tylist , tyleft , tyright , tygrid }
- tybox: <span data-type="tybox" data-label="Food" data-no="4"></span>
- tylist: <span data-type="tylist" data-label="Technology"></span>
- Column has two option one for left and other one for right.
- Column left: <span data-type="tyleft" data-label="News"></span>
- Column Right: <span data-type="tyright" data-label="Sports"></span>
- tygrid: <span data-type="tygrid" data-label="Video" data-no="6"></span>
Custom Widgets
Access your blog Layout > click Add a Gadget > HTML/JavaScript on Sidebar or Footer section, you must place the following codes highlighted in blue below.
- Recent Post
Recent Comments: <span class="latestcomments" data-no="5"></span>
After add, click save.
Social Counter
Go to Layout > Social Counter Area > Click on Edit > and follow this steps below.On "New Site Name" fild1 field add Social Name [Social Counter].
And on "New Site URL" fild2 field add your Social Url.
- Exemple: Only this Socials Supported !
facebook count=3.5k;Example:
twitter count=1.7k;
gplus count=735;
youtube count=2.8k;
pinterest count=524;
dribbble count=7.3m;
instagram count=849;
rss count=286;
Comments System
Access your blog Layout > click Edit link on Comments System widget.Add one of the following provisions
- [blogger] for blogger comments
- [facebook] for facebook comments
- [disqus] for disqus comments
you can add one system, two or three as you like and with arrangement you want for example
[facebook]
[disqus]
[facebook][disqusss]
[blogger][facebook]
[facebook][blogger]
[disqus][facebook][blogger]
[blogger][disqus][facebook]
Disqus Shortname
Access your blog Layout > click Edit link on Disqus Shortname widget.What you have to do is just add the shortname
Facebook Page Plugin:
<center><div class="fb-padding"><div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v2.3&appId=1395743857335531";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-page" data-href="https://www.facebook.com/templatesyard" data-width="280" data-height="230" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"></div></div></div></center>
or you can follow this tutorial if above method won't work
Author Profile Details
Author Social Widget
Go to your blogger dashboard > Layout > click Edit link on Author Social widget.
In the "New Site Name" field replace the word "facebook" with any social media website (twitter, youtube, google-plus, etc...).
Note: keep in mind that this template uses the "Font Awesome" service for the icons.
Follow this link for the complete set of icons that this service provides:
Footer Navigation
Shortcodes
- Full Width Post;
Go to Pages or Posts > New Page or Post
On the new page content/post content after adding the page/post title, add the [full_width] code in the page content area.
- Left Sidebar;
Go to Pages or Posts > New Page or Post
On the new page content/post content after adding the page/post title, add the [left_sidebar] code in the page content area.
- Right Sidebar;
Go to Pages or Posts > New Page or Post
On the new page content/post content after adding the page/post title, add the [right_sidebar] code in the page content area.
- Sitemap Page;
Go to Pages > New Page
On the new page content after adding the page title and hiding the comments using options, add the [sitemap] code in the page content area.
Theme Option
Full Width Version(trure/false):
- Add (true) to Boxed, to return the Full version just add (false)
PageNavi Results No:
- Type your number for Page Navigation, Default is "8"
Fixed Sidebar (trure/false):
- Add (true) to Fix the sidebar, to unfix just add (false)
Theme Colors
Access your blog Template > click Customize.Here is where you can change the main color of the model, using your favorite colors.
Installation And Custom Services
We provide plenty of templates for free but if you want something unique for your blog then let us create a unique design for your blog, Just tell us your needs and we will convert your dream design into reality. We also Provide Blogger Template Installation Service. Our Installation service gives you a simple, quick and secure way of getting your template setup without hassle.
How To Setup Tech Pro Blogger Template [TemplatesYard]
Reviewed by TemplatesYard
on
November 18, 2017
Rating:
How to add Random posts
ReplyDeleteIt only has random post button.
DeleteWhat about social share button it shows link
DeleteThat is a post sharing link. Anyone can copy and paste it to social media profiles for easy sharing.
Deletesir do u have a proper documentation > ? plz give me step by step . i m install already my theme and started to adding post
ReplyDeleteThis is the only documentation need, it has step by step guide to setup widgets.
DeleteWhere do the photos in slider come from?
Deletehello sir http://www.prishashah.com/ this is my domain in home page banner is not showing what to do now ?
ReplyDeletePost atleast 10+ article.
DeleteHow to Show Mega Menu, sir?
ReplyDeletethanks
It doesn't have mega menu.
Deleteso i add some pictures in my article and post it. but when i look the post, the pictures aren't showed but just blank space. do you know why ?
ReplyDeleteShare your blog url.
DeleteI have the same problem, the post makes the first photo background of the post header and removes it from the post... Fix this please. Or add an option to change this setting.
DeleteIt isn't an issue but a feature, you can see we have same in our demo.
Deletein my blog slider widget is not working
ReplyDeleteBecause you have removed the credits.
DeleteHi I would like to know how can I add more menu in "Main Menu" section ?
ReplyDeleteMy Blog : https://www.ahteestyle.com/
Just follow what we have suggested above.
DeleteHi I would like to know how to show slider by tag with more than 1 tag ?
ReplyDeleteYou can use the shortcode for recent posts to make it show post from various tags.
Deletemy Recent post covered ads. help
ReplyDeletewww,sakurahitam,net
We don't add ads in our template.
Deleteso, how to fix blurry slide-thumbnail? please help
ReplyDeleteUpload the images in original size option. and then follow this.
DeleteActivate every single widget we have mentioned in documentation and then follow this.
http://www.sorabloggingtips.com/2017/03/fix-recent-random-label-post-widget-in-blogger.html
Hi I would like to know which recommend size for slider picture?
ReplyDeleteUpload higher resolution images with original size setting.
Deletehi. when ı want to add to widget to be label in main fetured post area, 5 post shown. ı want to only 3 post.
ReplyDeletewhen ı usse no label, recent no problem only 3 post.
how can ı do only 3 post in 1 label
That widget is meant to show 5 posts, if you want to set it for 3 posts then you have to customize the js and css.
Deletesir how to change my theme background color, it is showing in white background, in my blogger page there is option to change bg image, but it is not changing how to solve this problem?
ReplyDeleteDue to limitations on white background is supportable.
DeleteSlider, Ticker, and other in my blog isn't working since I was applied this template
ReplyDeleteGood afternoon
ReplyDeleteHow can I change the image size in the article?
Where? Inside post or homepage.
DeleteInside post
DeleteYou will get options while uploading the image.
DeleteHey how can I make the menu open in a new tab?
ReplyDeleteSorry we can't provide support on additional customization rather than solving issues or bugs, if you want to customize your template then buy our blog customization service.
DeleteI was going to buy this template, but i have a problem with it, when i post something it shows two boxes in which it is written responsive ads here. how to fix this?
ReplyDeleteIf i cant fix this I am not buying this
Those are ad slots, either you can remove it or add your own ad codes.
Deletehow much for the template? i need to buy. will i get support for customization?
DeleteTemplate costs $10 and no support will be provided for customization.
DeleteHi, how do I use all the Advertisements widgets?
ReplyDeleteAdd your code into html/javascript widget
DeleteHi, how to add meta tags?
ReplyDeleteWe have already added it, you just have to customize it according to your site.
DeleteHi. At the moment of putting the code of the sliding menu "recent publications" nothing appears. Please help me.
ReplyDeleteHi, I'm having problems with Slider Widget, it's showing the image with a very low resolution, also the left and right columns are with low resolution, could you help me to solve this little problem?
ReplyDeleteMy website:
https://arkademg.blogspot.com/
Choose original size in settings while uploading images or simply click the image in post setting and choose original size option.
DeleteDidn't work. Apparently the code is converting the image to 72px72p and making it larger, so, it's 72x72 image stretched.
DeleteAfter installing the premium version of this template my site is showing some errors. Also my adblocker blocks some ads on my site but I have not pasted any ad code on my site. Please help me to fix those errors. My site is www.progadgets.review.
ReplyDeletei am facing the following errors:
Uncaught TypeError: Cannot read property 'length' of undefined
at Object.success ((index):7441)
at j (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at x (jquery.min.js:4)
at XMLHttpRequest.b (jquery.min.js:4)
Just setup the template completely, following above documentation.
Deleteif I have more than one author, as I do for a different description for each one.
ReplyDeleteIt doesn't have multi author functionality.
DeleteRecent Post doesn't work. It's only show 2 post, when I click next there's no post. Can u help me pls...
ReplyDeleteRemember one thing you have to keep the post count same in your blog settings and pagination widget.
DeleteThere is a limit of 1mb from blogger side, only 1mb of images or text you can show in home page and you are exceeding that limit and that is the reason rest of the post is going on next page, there is not any solution, but you can try page break after 1st paragraph in every post, may be this will help.
sir slider not working your template & how to remove post header what is problem??
ReplyDeletehow to increase related posts number
ReplyDeleteThis can be done in premium only.
Deletehello sir,
ReplyDeleteI have an issue with "Main menu" - I have added blog address to each menu links (URL), but when i use to click on main menu items it first shows me Error 404 and after that it redirects me to specified blog post... why it is showing Error 404 while clicking on main menu items.
Is there is another method to link main menu items to our blog post?
please tell me..
My Blog Address is: http://www.babanetworks.com
Thanks in advance for solving my problems
add the url completely including http://
DeleteGood morning, is it possible that the post image does not stand out and appear normally at the beginning of the news?
ReplyDeleteSorry we can't provide support on additional customization(Adding or Removing stuffs) rather than solving issues or bugs, if you want to customize your template then buy our blog customization service.
DeleteTicker News not work properly, runing without animation
ReplyDeletewww.pdmpurbalingga.com
how do I add labels that contain spaces to place in data-labels? I have placed but did not work
ReplyDeleteYou can add labels with space.
DeletePlease,
ReplyDeleteMy Homepage in Feautured is Blank
https://3.bp.blogspot.com/-fsZUinboJX0/W9LNzEXXJkI/AAAAAAAAAG8/b39HUh3lV1IJHC1ya11n5qTCgiabQV_swCEwYBhgL/s1600/tech%2Bpro.jpg
if it's updated, the image above the article I suggest is displayed normally. It's not like now being cut off.
ReplyDeletePlease explain your issue more clearly.
DeleteHello, I want to buy this theme, but before I purchuse it, I test the free code here and "recent posts" doén't work, please help me...
ReplyDeletehttps://viet-project.blogspot.com/
Hello, I want to buy this theme. However, I'm wondering if it's possible to change which icons are shown when the user hover any post card in home screen, e.g. news icon, sports icon, video icon, etc., or how they actually work.
ReplyDeleteThanks in advance.
Icons are related to blog category, you can sign any icon to any category fro layout.
DeleteThanks for your reply. Just a last question: is it possible to use a dark background and white text? I want something to look like my actual layout at https://frenegeek.com
DeleteCan you provide a screenshot of that specific area.
DeleteMy blog is www.heathpedia.com . In that the breaking news ids not moving. Earlier it used to move but now it just stays at one place.
ReplyDeleteJust I checked and it is working fine
DeleteWhen I use any embedded youtube video my post image gone to blur. What can I do?
ReplyDeleteShare blog url.
DeleteThe two ad slot above and below body post doesn't show my adsense ad
ReplyDeleteAre you converting the ad code or directly implementing it.
Deletehow to use codebox, tables and alert boxes and download buttons
ReplyDeleteYou can follow this tutorial.
Deletehttp://www.sorabloggingtips.com/p/shortcodes-and-page-markups.html
Hello! I just want to know why it redirect to another page when I use anti ad blocker code? How can I solve this problem?
ReplyDeleteWe don't guarantee third party codes.
DeleteHow do I edit the boxes that appear in posts as "responsive ads"? My template is the premium version
ReplyDeleteThat can be done from the layout.
Deletemy contact form is not sending emails pleas help
ReplyDeleteYou have to install blogger's official contact form first.
DeleteJUst want to buy this template, how to change icon when user do hover, and how to use Label Icon CSS
ReplyDeleteCan you improve the mobile version of menu and sub menu views?
ReplyDeleteif you want to customize your template then buy our blog customization service.
Delete