Posts

Showing posts with the label Blogger Homepage

create Homepage in blogger using bootstrap

  Homepage - Design Process The technique to style a homepage using Bootstrap 4 is easy and straightforward. This post shows a homepage with a right sidebar and a single section homepage styling method, which we are familiar with. There are many other homepage designs you can create for your blogger theme such as a minimalist homepage, a homepage with multiple sidebars or a homepage with a left sidebar styles. At this stage, the homepage styling process is mainly to position the homepage main section and the sidebar section in a horizontal position order. We need to apply Bootstrap grid system to <b:section id='main'>...</b:section> and <b:section id='sidebar'>...</b:section>. Below are two important concerns to create a horizontal position order for the main section and the sidebar. Apply <div class='col'> to the main section or above the <b:section id='main'> in order to keep the width of main section flexible to the...

How to a Show Gadget/Widget only in a Specific URL in Blogger

Image
  How to a Show Gadget/Widget only in a Specific URL in Blogger  Sir Chogyal Step 1: Copy the title of your widget that you wanted to show only in a specific URL. Step 2: Go to "Theme" in your blogger. Step 3: Click on the three dots drop down menu and go to "Edit HTML" Step 4: Left click inside the HTML code and press Ctrl+F on your keyboard. Step 5: Paste the title of the widget and hit Enter in your keyboard. Step 6: Just above <!-- only display title if it's non-empty --> You can past this code <b:if cond='data:blog.url == " YOUR SPECIFIC URL "'> Step 7: Replace  YOUR SPECIFIC URL  with your specific URL. Step 8: Paste </b:if> below this line <b:include name='quickedit'/> Summary: <b:if cond='data:blog.url == "YOUR SPECIFIC URL"'> Widget code........ </b:if>  MAKE THIS VIDEO TOO Hide a widget/gadget from a specific URL in blogger

Hide a widget/gadget from a specific URL in blogger

Image
  How to a Show Gadget/Widget only in a Specific URL in Blogger Hide a widget/gadget from a specific URL in blogger  Sir Chogyal Step 1: Copy the title of your widget that you wanted to hide from a specific URL. Step 2: Go to "Theme" in your blogger. Step 3: Click on the three dots drop down menu and go to "Edit HTML" Step 4: Left click inside the HTML code and press Ctrl+F on your keyboard. Step 5: Paste the title of the widget and hit Enter in your keyboard. Step 6: Just above <!-- only display title if it's non-empty --> You can past this code <b:if cond='data:blog.url != &quot; YOUR URL &quot;'> Step 7: Replace  YOUR URL  with your specific URL. Step 8: Paste </b:if> below this line <b:include name='quickedit'/> Summary: <b:if cond='data:blog.url != &quot;YOUR URL&quot;'> Widget code........ </b:if>  Make this video too

To hide gadgets on specific pages:

Image
  May be some of you have noticed that when you add a gadget or widget to your blog it will show up on every page of your blog. And many of you want to show widgets on specific pages for example if your blog contains contact page or sitemap and there is no need of search box and few other widgets, so you want to hide them on these pages. Many beginners to blogging don't know how to do that. to hide or show widgets on specific pages of blogger follow the below steps: To hide gadgets on specific pages: (1).  The first step is to name all the widgets on your blog by going to  layout  to make it simple for you to find the widgets in html of you template, so name all the widgets or a specific widgets which you want to show or hide. Remember to give a unique title to every widget to avoid any confusion. (2).  After naming the widgets go to  template  and click edit html, as shown in below image. (3).  Now jump to widget which you want to show or hi...

How to Show/Hide Widgets/Gadgets on Homepage in Blogger

  Add red lines where they are put b:widget id=’HTML1′ locked=’false’ title=’Recent Posts’ type=’HTML’> <b:includable id=’main’> <b:if cond=’data:blog.url == data:blog.homepageUrl’> <!– only display title if it’s non-empty –> <b:if cond=’data:title != “”‘> <h2 class=’title’><data:title/></h2> </b:if> <div class=’widget-content’> <data:content/> </div> <b:include name=’quickedit’/> </b:if> </b:includable> </b:widget>

How To Show Only Post Thumbnails And Snippets In Blogger Blog Homepage

Image
  How To Show Only Post Thumbnails And Snippets In Blogger Blog Homepage Hi  Welcome to another tutorial, How To Show Only Post Thumbnails And Snippets In Blogger Blog Homepage in this   complete blogger blog tutorial   series. By default, blog post shows full on your blogger blog homepage with a number of it as preset. This makes your blog looks clumsy, not neat and visitors leave your blog site quickly. If you’re tired of those full, long unending post of your blogger homepage, then you’ve come to the right place, just follow the tutorial and you should be fine! We have covered a lot in this  full blogger blog tutorial  series, first, we look at  Blogger Review  to  How To Create A Blog On The Blogger.com Platform . We also learned  How To Create HTML Sitemap  Page for our blogger blog, in another tutorial, we’ve seen how to add  Contact Form In Blogger On A Page , from there we added  Twitter Card  To our blog....