Multi Level Drop Down Menu In Blogger/BlogSpot Blogs

UPDATE:  I updated some of my posts, this post I update 17+ Drop Down Menu Widget in Blogger - Horizontal Menus With CSS & HTML Codes........

Log in to blogger, go to "Layout", click on "Edit HTML" tab.
Now find (CTRL+F) this in the template:

Immediately BEFORE it, place this code:

Now click Save Template 

STEP 2:
Now go to "Page Elements" of  "Layout".
Add a Gadget of HTML/JavaScript type.

Then add this code in to it:

Item 1
Item 2
Folder 1

Sub Item 1.1
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4


Item 3
Folder 2

Sub Item 2.1
Folder 2.1

Sub Item 2.1.1
Sub Item 2.1.2
Folder 3.1.1

Sub Item 3.1.1.1
Sub Item 3.1.1.2
Sub Item 3.1.1.3
Sub Item 3.1.1.4
Sub Item 3.1.1.5


Sub Item 2.1.4




Blogger Help

Then save this widget. And drag it just above the posts widget.

note: this is not allowed all templates

Read more

понедельник, 22 июня 2015 г.

Random Posts Widget For Blogger Blogs

This widget can definitely bring some excitement to your blogger powered blog. Letting your readers surf your blog to the fullest extent by creating a link to a random post in your blog's sidebar.

Adding a Random posts widget is very easy...
Simply log in to Blogger, go to Layout, click on "Add a Gadget", and select it as "HTML/JavaScript" type.

And finally paste this code in to it:

Blogspot Tutorial

Edit the code shown in 'red' to change the number of posts being displayed in the widget.

NOW CLICK SAVE TEMPLATE

Read more

New Multi-Tabbed Widgets For Blogger / BlogSpot Blogs

One of the space efficient widget for blogs, is of course a multi-tabbed widget, which is almost a must for any blog. You can use it for Popular posts, Top commenters, Recent Posts, Recent Posts or any widget as you like.

Although you can find some other methods on Internet, but they are all quite confusing, so you can use this method, which is quite easy, but of course needs to tweak the template.

The complete process has mainly two steps:

UPDATE:  I updated some of my posts, this post I update Add Multi Tabbed Navigation Widget To Blogger / Blogspot Blogs Sidebar........

STEP 1


Log in to Blogger. Now go to Layout and then click on "Edit HTML" tab.
Then download the present template as a backup.
Now find [CTRL+F] this code:





Then immediately ABOVE / BEFORE it, paste this code:






Now click Save Template, and

Click on "Page Elements" tab.


Then click on "Add a Gadget", and select it as "HTML/JavaScript" type.

In the new widget, paste any of the 3 codes displayed below (the screen-shots are displayed above the codes, and demo link has already been given above ):

Code Here:

Demo #1- Basic implementation

• Tab 1


• Tab 2


• Tab 3


• Tab 4


• Dynamic Drive

Tab content 1 here
Tab content 1 here

Tab content 2 here
Tab content 2 here

Tab content 3 here
Tab content 3 here

Tab content 4 here
Tab content 4 here

Back Click here to select last tab Forward

Code Here:

Demo #2- Different Tab Style, expanding of arbitrary DIVs on the page enabled

Arbitrary DIV 1

Arbitrary DIV 2

Arbitrary DIV 3

Tab content 1 here
Tab content 1 here

Tab content 2 here
Tab content 2 here

Tab content 3 here
Tab content 3 here

Tab content 4 here
Tab content 4 here

• Tab 1


• Tab 2


• Tab 3


• Tab 4


• Tab Content

Click here to select 3rd tab

Reload page and select 2nd tab using URL parameter

With Auto-scrolling tabs...


Code Here:

Demo #3- Different Tab Style, "slideshow mode" enabled

• Tab 1


• Tab 2


• Tab 3


• Tab 4


• Google

Tab content 1 here
Tab content 1 here

Click here to select tab with id="myfavorite"

Tab content 2 here
Tab content 2 here

Tab content 3 here
Tab content 3 here

Tab content 4 here
Tab content 4 here

Now click Save

 

Read more

Show Recent Posts Widget In BlogSpot / Blogger Blogs

UPDATE:  I updated some of my posts, this post I update Recent Posts Widget for Blogger / Blogspot with Summary And Read More........

STEP #1 Log in to Blogger, go to Layout

Add a Gadget of HTML/JavaScript type. 

Then add this code in to it:.

Recent Posts Widget by Blogger Widgets

And now click Save

 

Read more