After successful response from user I have released today Blogger Lab v1.1 and also releasing Blogger Lab Full width v1.1. I hope this template will give you best user experience. I have fixed all bugs. And Pure Font Awesome based icons used on various part of the template. Hope you would like it.
Blogger Lab Full Width Responsive Template
Version: 1.1
Platform: Blogger / Blogspot
Release date : 26th May 2015
Author : Mohammad Fazle Rabbi
Website: www.bloggerspice.com
License : Creative Commons Attribution 3.0
Some Features that has incorporated with this beautiful template-
| Features | Availability |
|---|---|
| Responsive Template Design | Yes Check |
| Unlimited color Changeable option | Yes |
| SEO friendly | Yes |
| Fast Loading | Yes Check |
| Auto Blog Post summarize And Read More Button | Yes |
| Auto Image Crop With Thumbnail (Home Page and Label Page Only) | Yes |
| Dynamic Heading | Yes |
| CSS And HTML Base Menu With Drop down (Superfish) | Yes |
| Sidebar Tabs Widgets ready (Powered By Jquery) | Yes |
| User Friendly JASON Search Box | Yes |
| 2 Column Style | Yes |
| Beautiful Layout Style | Yes |
| Clean Typography | Yes |
| Custom Official RSS Subscription Widget | Yes |
| Font Awesome 4.3.0 based icons (Latest Version) | Yes |
| CSS Based Social Share Widget (Placed Post Footer) | Yes |
| Ads Banner Ready | Yes |
| Breadcrumbs | Yes |
| Post Rating | Yes |
| Related Posts with Thumb | Yes |
| Social Share Button | Yes |
| Numbered Page Navigation | Yes |
| Flicker Image Gallery | Yes |
| Bouncing back To Top | Yes |
| Shortcodes | Yes |
| Meta Keywords And Description Support (Official Meta Description Support) | Yes |
| Multi Author Supported | Yes |
| Emotion | Yes |
| Unique Comment System | Yes |
| Custom 404 Page | Yes |
| Well Documentation | Yes |
Installation
For installing this template please visit the below tutorial and follow 2nd Method only-
Need Help?
Blogger Lab Full Width Version Responsive Template download zip file included A to Z Blogger blog Creation to Theme
Instillation Help. So New Blogger’s And Professional Blogger Can Understand How
to Work with this Blogger Template. If You Use My Theme and Need Help from Me I'll
do my best to assist you. I Online 8 Hours Per day so leave a comment below or
send me email. My Time one GMT + 6:00). For SEO related open discussion you can
write in comment section. Thank you.
License
This free Blogger template is licensed under the Creative
Commons Attribution 3.0 License, which permits both personal and commercial
use.
However, to satisfy the 'attribution'
clause of the license, you are required to keep the footer links intact which
provides due credit to its authors. For more specific details about the
license, you may visit the URL below:
- http://creativecommons.org/licenses/by/3.0/
Troubleshooting
There are
some problem with in template installation. Because this template build with
HTML2 so sometimes problem may arise. So here is some pre solution for
installing the template accurately.
- Question: My Template is showing Double Post?
- Answer: This can be happen due to older template's code mixed with new template HTML code. So to solve the issue you have to make a clean installation. That means you have to remove all previous code of your older template and after that add the new template code. For details tutorial please visit the below Tutorial link and follow the 2nd method.
- Question: No post content is displaying while clicking on Post link?
- Answer: This problem may arise but the solution is very simple. Just follow the below steps-
Step 1 Log in to your
Blogger Account and Go to your Blogger Dashboard
Step 2 Click
on -> Template -> Edit HTML->
Step 3 Now find Blog1 or Blog2 by pressing Ctrl+F (Windows) or CMD+F (Mac)
Step 4 Now replace Blog1
with Blog2. If you find Blog2 then replace Blog2 with Blog1.
Step 5 hit the Save template button. And check you template and see your post content is displaying.
I hope question from your guys thus I can give solution while you are using my template. Thank you.
osadharon ekti template share korlen vai color ta darun hoyeche ..
Thanks Aslam.. :baby
:bad-angry
i cant download this template .... :dont-know
Hi Mayen Download link is working well.. try with different browser.
http://www.mediafire.com/download/tt3aflookibcjhr/Blogger+Lab+Full+Width+V1.1+Responsive+Template.zip
helpful thak you very much
Welcome Bro ;)
i face a problem about this template. i send a screenshoot of that problem on facebook.
Hi Saidur..
Apni nicer code ta search koron abong sekhan theke background-color:#FEFEFE; code ta background-color:#dfd0a1; diye change koron.
#spiceright{width:99%;float:right;background-color:#FEFEFE;}
abar nicer code ta search koron
#post-wrapper .innerwrap{padding:0 10px;}
aaita replace kore nicer code add koron
#post-wrapper .innerwrap{padding:0 10px;background-color:#dfd0a1;}
hope it will work now.
গুগোলে banglasahittoblog.blogspot.com লিখে সার্চ দিলে টাইটেল এর পরে ব্লগের ডিসক্রিপশন আসে না , আর read more এ ক্লিক করার পর পোস্ট এর লেখা বড় করতে চাই।
Please follow the tutorial from below link-
http://www.bloggerspice.com/2014/12/blog-meta-title-description-for-search-engine.html
for increasing Font please addd below link before closing b:skin
.post-body{font-size:200%;}
what is b:skin? please details.
Copy the script from below and Paste it above/before ]]></b:skin>
.post-body{font-size:200%;}
ami to eta chai ny. ami chaichi j read more a jowar por likha ta jeno boro dakhay. apnar solution a home page a likha boro dakhay & read more a gela likha ager moto choto dakhay. ami home page a likha choto r read more a jawar por likha boro dakhta chai.
in the post so that writing can be big, bold and italic how to edit it. I already create a big, bold and italic but always save so little writing on the post. thanks
in the post so that writing can be big, bold and italic how to edit it. I already create a big, bold and italic but always save so little writing on the post. thanks
Hi Ferdina
I can't understand what exactly you want to say. Do you want to increase/decrease Font size of this template???
if you wish you can write your own native language (Indonesian). Please write clearly. :t
Selamın aleyküm brother I install this theme, but the next button is malfunctioning.
have the same problem the next button on your site is malfunctioning.
How to solve this problem it is the reason?
I'm waiting for a response from you. please help me
Walaikumus Salam Brother Baris Vatansever..I think Blogger platform has updated. For this reason Ajax file is not functioning properly. So you have to disable the Ajax file.
Please go to your Blogger Dashboard -> Edit Html
Now locate below code
Prev",next:"Next »",loadAjax:true,
Now simply alter loadAjax:true with loadAjax:false
It page navigation will work now. However this is a temporary solution. I will work for further solution. Thank for the information. :wr
Very very Thank you brother loadAjax true change loadAjax:false and the problem was solved :up :lo |o| I'll follow you to solve the problem of loading gif.
you let me know if there is a solution have please.
I am going to be so happy... brother
I want to ask you something brother.
I want to remove the top title LATEST POST.
right. column 3 title Popular and comments. category. how can I do it ?
If you help me. I would be very happy.
Thank you in advance. brother
You can come and see what I want to do my blog. my. blog name Blogdan indir
Hi Baria, For removing Latest post please Edit your template and locate script like below and delete it.
<div class='innerwrap'>
<div class='drop-menu'>
<div><div class='menuitem'><a class='itemexpend' href='#'>
KATEGORİLER
</a>
<div class='hidden' id='droplabel'></div>
</div>
</div>
</div>
<script type='text/javascript'>
labeljs();
</script>
You can remove Popular posts and comment from Blogger Layout section. But you can't remove the tab. Because the tab script is encoded with other script. If you delete then template will break. I did this for script protection. :as
Suddenly Ajax based all widget stop working in Blogger platform. This problem has arises from Google Blogger.
different codes bro
theme gives an error
I want to add three topic which are popular editions, comments and categories on top of the left column.
And can we change the codes.
Can you please help me about this issues ?
sorry bro. I wrote wrong. left column
I want to add three topic which are popular editions, comments and categories on top of the right column.
And can we change the codes.
Can you please help me about this issues ?
Hi Baris, You can remove below URLs only.
<div class='drop-menu'>
<div><div class='menuitem'><a class='itemexpend' href='#'>
KATEGORİLER
</a>
<div class='hidden' id='droplabel'></div>
</div>
</div>
Thank you very much bro.:sl :yeh
categories. Removed smoothly :go
There is only one problem. brother
Are you going to help me in the right column?
Hi Baris This is little bit tough job for you. I am not sure that you can implement the code or not. Take a backup first. otherwise template may break.
now Edit your template and find the below code
#sidebar-middle .navtab li{width:50%;}
now replace it by below code..
#sidebar-middle .navtab li{width:33.33%;}
Now again find below code
<li class='nav-two'><a href='#commenttabs'>Yorumlar</a></li>
and add the below code after above code
<li class='nav-three'><a href='#archivetab'><i class='fa fa-star-o fa-lg'></i></a></li>
Now again find the below code
<div class='hide sidebarmiddle-widget' id='commenttabs'>
...................................
...................................
...................................
...................................
</div>
and after above code add the below code block
<div class='hide sidebarmiddle-widget' id='archivetab'>
<div class='sidebar tabct section section' id='sidebar-archivetab1'><div class='widget BlogArchive' data-version='1' id='BlogArchive1'>
<div class='widget-content'>
</div>
:ex
Theme gives an error.
I take a video which you can see the error.
can watch it here
watch 7.20p for a clear view
https://www.youtube.com/watch?v=yV04DIbjfo4
Brother Baris, You didn't understand the last part. You have to add script after below code. Don't add this with dot dot dot.
<div class='hide sidebarmiddle-widget' id='commenttabs'>
...................................
...................................
...................................
...................................
</div>
It's better download "Smooth Mag Full Width Template" from below URL and check how third tab code I have added. just copy the code from that template.
http://www.bloggerspice.com/2015/05/download-smooth-mag-full-width-responsive-template.html
Thank you very much bro. I finally managed
but there is a small problem.
Tittles are not regular how can i fix them?
Brother Baris.. just locate code block like below
<li class='nav-one'><a class='current' href='#populartab'>Populer</a></li>
<li class='nav-three'><a href='#archivetab'><i class='fa fa-star-o fa-lg'></i></a></li>
<li class='nav-two'><a href='#commenttabs'>Yorumlar</a></li>
Now change it like below
<li class='nav-one'><a class='current' href='#populartab'>Populer</a></li>
<li class='nav-two'><a href='#commenttabs'>Yorumlar</a></li>
<li class='nav-three'><a href='#archivetab'>Categories</a></li>
after that, go to your Blogger Layout section and change the widget. add comment widget under comment tab and add Label widget under Categories tab.
I hope it will work now. :dn
Thank you very much bro
but I ask you something
Why does not the icon title
There are popular titles and icons
but no icon category and reviews
How do I make visible
Allah Senden Razı Olsun Kardeşim
Brother you have to use Font awesome icon code. You will get it from below URL
http://www.bloggerspice.com/p/font-awesome-cheatsheet.html
and add the code like below before tab title.
<i class='fa fa-star-o fa-lg'></i>
for adding different icon just change "fa-star-o" from above code. :up
hello sir, google structruldata tool show many errors as shown in following link : http://i66.tinypic.com/2crmwle.jpg
Plaese give me improved code for this error, i fien d on many balgs but not correct still, so plz help me, my blog is www.utkarshclasses.com/
hello sir, google structruldata tool show many errors as shown in following link : http://i66.tinypic.com/2crmwle.jpg
Plaese give me improved code for this error, i fien d on many balgs but not correct still, so plz help me, my blog is www.utkarshclasses.com/
Hi UTkar classes,
I have designed this template before. You have to fix it by following my couple of tutorial on SEO article section. in updated version I will fix it.
http://www.bloggerspice.com/search/label/SEO?&max-results=5
Thank you. :)
Hi, I was tryiing to explore this template but having one issue in comment box loading.
That Comment box iframe is not loading unless I'm signed-in in.
Hi Raj Beniwal, Have you got the problem in Post page or static page comment box? Comment box iframe script is below.. If script has broken then you can replace the comment iframe script.
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
:up
sir, in search engine "text to search" i added all code but if we try to search anything then on search result page no google ad come, what can i do?
This template containing Json search feature. Not any ad will display. This is advance search system.
remove <meta content='90' http-equiv='refresh'/> code from your tempalte. Because your AdSense maybe disable for this tag. auto refresh violate adsense's terms and conditions.
^_^
Thanks Dear Friend Rabbi
I want to try this on my site. Amazing Theme. Awesome responsive on all gadgets. But a small query, Is it help to remove structed data authors and post id error
Thanks a ton
Hi Sumit Kumar,
Please follow my all tutorial about schema.org to solve all template error.
http://www.bloggerspice.com/2016/01/fix-image-AMP-error-from-your-blogger-template.html
http://www.bloggerspice.com/2015/12/trick-to-fix-missing-author-error-from-Blogger-template.html
http://www.bloggerspice.com/2016/02/how-to-fix-all-AMP-error-from-Blogger-static-pages.html
http://www.bloggerspice.com/2015/12/how-to-include-my-blog-social-profiles-in-Google-search-results-by-Schema.org-markup.html
http://www.bloggerspice.com/2015/12/how-to-fix-dateModified-missing-and-recommended-error-from-blogger-template.html
http://www.bloggerspice.com/2016/01/how-to-solve-publisher-missing-and-required-error.html
http://www.bloggerspice.com/2016/01/fix-image-AMP-error-from-your-blogger-template.html
http://www.bloggerspice.com/2016/02/data-vocabulary.org.markup.for.blogger.breadcrumbs.html
http://www.bloggerspice.com/2015/11/remove-and-Fix-imageURL-postId-and-blogId-error-from-Blogger-template.html
Thank you. :)
Thanks a ton again rabbi
Great work done by you always. Now i will clear all structed data error on my blog.
Thanks Again
I have apply this template on tallyssolution.blogspot. com but I am unable to configure multi tab widget of popular post and comment. How to configure comment tab in side bar widget. Please reply
Thanks in advance rabbi.
I want to hire your services. Please send quotations
Hi Sumit Kumar,
I think widget container has become hidden in your site.
Regarding your design order please send me your requirement. Then I can tell you the price. Recently I'm working on a RTL version of AMP blogger theme design. So after completing this design I can start your work. Hopefully within 1 week I will be free.
Thank you. :)
Dear Rabbi
How to activate hidden widget container in this template. Please reply
In my Demo site Layout is ok. And comment container widget is displaying. For making the layout more clearly just update the layout script by 'Edit HTML' like below.
body#layout #header-wrapper {margin-top: 40px;width: 100%;}
body#layout #headerads{width:60%;}
body#layout #header{width:30%;}
body#layout #sidebar-wrapper {overflow: visible;width: 50%;}
body#layout #post-wrapper {overflow: visible; width: 50%;}
hopefully widget would be visible now. :)
Where to post above code. Please help
Also please suggest how to make drop down menu sticky. Please help
Hi Sumit Kumar :)
To make sticky menu please find the below 2 CSS script
#nav {
height: 46px;
background-color: #3A4249;
position: relative;
font-family: 'Montserrat', Open Sans,sans-serif;
}
and
#main-wrapper {
padding: 10px 0px;
padding-top: 15px;
background-color: #FFFFFF;
}
replace the above script by below code block.
#nav {
height: 46px;
background-color: #3A4249;
position: fixed;
width: 100%;
font-family: 'Montserrat', Open Sans,sans-serif;
z-index: 999;
}
and
#main-wrapper {
padding: 10px 0px;
padding-top: 55px;
background-color: #FFFFFF;
position: relative;
}
Thank you.
Thanks Rabbi
Sticky Dropdown works now,but it is looking some odd because when scroll down it appear on a fix stage not on top of the screen. How to fix it on top of the screen and remove space above the navigation bar. Please help
Hi Sumit, to make it smooth you have to use Jquery script. But it requires time for coding.
I just shown you the simple way to make the menu sticky without any JavaScript and jquery script. And it doesn't affect theme loading speed.
Thanks rabbi.
Now comment section appear on my site.
I need your help on a very small matter. Please reply if you are available
Thanks in advance
Hi Sumit,
My request is to make comment on relevant article's comment section. For widget related help make comment on widget related article and for Blogger theme drop comment under theme related posts.
Thank you. :-bd
Hi Rabbi
Thank you so much for the wonderful template, you are doing great bro..
Meanwhile could you please help me on a issue i am facing with the template :
On my home page, the list of posts are being displayed along with author,time etc etc but the date of posting that article is not being displayed.....please help me out on the same
Thankss !!!
Hi Suraj :)
Simply you have to set the date from Blogger Dashboard. Please follow the tutorial from below URL.
http://www.bloggerspice.com/2016/05/blogger-comment-timestamp.html
Thank you :up
Hi Rabbi
Thanks for the quick reply !!!
I am having issues with my posts time stamping ....on my home page the different dates on which i posted my articles is not being displayed .... comment section is working properly... so kindly help me onto the post timestamping.... meanwhile i have checked all the blogger setting... they are fine ....maybe i have to edit something in my html .... my blog address is http://theequitybull.blogspot.in/
Thanks Again !!!
You have to set all the timeformat similarly. Just follow the below instruction
Settings -> Language and formatting -> Formatting then set
Date Header Format 5/22/2017
Timestamp Format 5/22/2017
Comment Timestamp Format 5/22/2017
Thank you :up
Awesome bro... thank you so much !!!
Hi Rabbi sir
I am facing trouble with my home page recently, only 3 posts are shown on home page wheras my current setting is 9, also i have tried to rectify it by restoring the back up i made previously, but the problem could not be resolved. Kindly help my website link is http://www.theequitybull.com/
Thanks !!!
Hi Suraj Choudhary :(
This problem arises from Blogger platform not from Blogger template and you will see problem in specific content. You can solve this issue by taking them in draft mode. but there are some reason this can be happen like...If you publish post from a slow internet connection then it would be happen. And also when user take longer time to publish an article from Blogger post editor then it will cause you similar types problem.
But when you taken your last post in draft mode then all post will start display. And remember that this problem contains your last published content.
I just checked your Blog and 7 posts is displaying on homepage. 5-7 posts (Blogger's recommendation) are ideal for blogger homepage. because more than that your site will load slowly.
thank you :up
thank you so much !!! Also could you help me on some more issue, When I bold out any lines of my article in draft mode, the preview does not shows those lines in bold format i.e. they appear as normal text. Also, when i include any website link in my article in hyperlink format, the preview shows it as normal text .i.e. you cannot open the website by clicking on the link, you have to copy and paste in address bar.
Like you can see on my blog http://www.theequitybull.com/2017/06/ipo-updates-cdsl.html
Thanks Rabi sir, one more thing i wanted to ask is, the comment box of this theme does not gives a threaded view....all comment appear sequentically in boxes which does not looks cool, any solution for that ??
Resolved the issue.... kindly ignore previous comment
Dear Sir
The issue i am facing is with its mobile view, there is a space left in right hand side when opened on mobile, that is the website is not able to utilise the screen size completely, i have tested this on different mobiles, however it works fine with tablets & laptops. Kindly Assist
Hi Rohit Jain :)
Have you disabled the mobile view from the back-end of the blogger settings? Disable the mobile view and select show desktop theme on mobile device. I think your problem will solve now.
Hi Suraj :)
I am very glade to heat that. Best of luck bro.. :up
Hi Suraj,
In my demo site everything is working fine. Please check your blog and and make URL on Post editor carefully. Thank you.
Yes rabi sir, have been doing the same.....I think the viewport settings are not working effectively
Hi Rohit
But I can see theme is working perfectly on my device. Please replace the below viewport script by second script.
<meta content='width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1' name='viewport'/>
replace above script by below script
<meta content='width=device-width,minimum-scale=1' name='viewport'/>
how to activate the featured post
and about middle-top middle-middle1 and middle-middle2 , what those words or sections for
?
please
Hi Muhamad Gaos,
Those are for adding widget and ad banner. :)
Hell Sir,
Please sir solve the below issues, Yah problem 15 dino se bana hua hai, please sir
1.my theme is not save after if edit the theme
2.If i can change the theme message displayed below:
We're sorry, but we were unable to complete your request.
When reporting this error to Blogger Support or on the Blogger Help Group, please:
Describe what you were doing when you got this error.
Provide the following error code.
bX-63kdm9
This information will help us to track down your specific problem and fix it! We apologize for the inconvenience.