Cari Blog Ini

Tampilkan postingan dengan label HTML/ Javascrip. Tampilkan semua postingan
Tampilkan postingan dengan label HTML/ Javascrip. Tampilkan semua postingan

Kamis, 31 Januari 2013

Now Step Two to Create Internal Links And Backlinks To Different Blogger Blog Post

Now you know how to create links to sections within Blogger Posts Let's look at how to create internal links within different Blogger Blog posts.

Most of you will be able to create a links to another post in Blogger using the posts editor. You Just highlight the text you want and click on the figure eight icon and Blogger creates the link for you. Which is great most of the time.
         
                                 

However what if we want to direct the visitor a particular section of a different post? When you create a an internal link it will take the viewer to the top of the page but what if you want them to see something near the end of the article? Well using an internal link similar to what we did to create internal links within the post we can. Say I want to take my reader to a particular post in this case Google Page Ranking And Google Analytic Tips. How would I go about it.


I create the link as usual by copying the article URL address from the browser address bar and using the post editor to add the link. The Blogger post editor uses this structure:

                 <a href="URL Address"> Link Name</a>

So the Blogger editor would create the following link:
    
                 <a href="http://trickofblogging.blogspot.com/2013/1/you-put-chitika-ads-to-blogger
                   blogspot.html"> You Put Chitika Ads To Blogger Blogspot</a>

The Link would Appear like this in a browser:

                
                  You Put Chitika Ads To Blogger Blogspot

Now I Want to direct my visitors to the section about creating breadcrumb navigation so I add a section name using the following structure;

                  <a href="URL Address#identifier"> Link Name</a>

Thus my link would look like this in the Edit HTML section of my post editor

                 <a href="http://trickofblogging.blogspot.com/2013/1/you-put-chitika-ads-to-blogger
                 -blogspot.html#breadcrumb"> You Put Chitika Ads To Blogger Blogspot</a>

Note the link seen in a browser remains the same. If you want you link to open in a new browser window add the following to your link.
   
                <a href=http://trickofblogging.blogspot.com/2013/1/you-put-chitika-ads-to-blogger-
                  blogspot.html#breadcrumb" target="_blank"> You Put Chitika Ads To Blogger
                  Blogspot</a>

Now I need to go to the post I am linking to and add the anchor. So in the post You Put Chitika Ads
i would use the following structure to link to section about how to add breadcrumbs.

                 <a name="identifier> A Heading</a>

So the section about breadcrumbs in the You Put Chitika Ads article is now  enclosed by the following:

                <a name="breadcrumb"> Add Breadcrumb Navigation to Your Blogger Blog</a>

If you now click on the link below you will see that your browser open a new window and take you directly to the section about adding a breadcrumb to your blog.




 Most Recommended Articles:


  

Kamis, 24 Januari 2013

Add A Simple Drop Down Menu To Blogger Blog

In today's Blogger tutorial i show you how to add a simple drop down menu widget sometimes called a select box to the sidebar of your Blogger blog. If you want to add lots of links to your blogger blog but are worried about the amount of space this will take up on your blog this will take yup on your blog this tutorial is for you. A drop down widget is a neat solution to the cluttered sidebar problem as it is both space saving and easy to install. The convenience of drop down menu widget can be seen on many blogs where it is used for lists like a long Blogroll, Categories list, Labels list or a Recommended Posts list.

If you want to add Drop Down Menu by replacing the Home Pages then click below link for adding CSS Drop Down with amazing effect with Customization.

Add Manually CSS Jqeury Drop Down Menu By Replace/Remove Pages On Blogger

How to Add a drop down menu widget to Blogger:
Adding a drop down menu to capabilities of even beginner bloggers. Most of the work is in cutting and pasting the links which is not difficult for anyone with basic
computer skills. So let's get started but first here is a working drop down menu list with links to various posts in my blog:

Log in to Blogger if not already logged in.
 Navigate from the Dashboard to Layout > Page Elements.

Click on Add a Gadget in the sidebar or other location if you wish:
Select a HTML/ Javascript gadget from the list of gadget.

Paste the following code into the content box of the widget:

<from><selcet name="menu"
onchange="window.open(this.options[this.selectedindex].value,'_blank')"
size=1 name=menu>
<option>- Your Menu Title
-</option>
\
<!--Change the following links to your own -->

<option value="http://URL of link1"> Link1</option>
<option value="http://URL of link2"> Link2</option>
<option value="http://URL of link3"> Link3</option>

                  Like

<option vaule="http://trickofblogging.blogspot.com"> Trick Of Blogging </option>
</select></form> 


Replace _Blank as Follows:

To have a new window open leave the same.
To have the new page appear in the same window replace _self

Replace - Your Menu Title with a title of your own.

For each instance of the option values highlighted in read substitute your own links and links names.


Click Save:
Use drag and drop to position the drop down menu widget in the location you want it within your sidebar and save any changes.

Click view Blog to admire the new drop down menu in the sidebar of your Blog.

In today's Blogger tutorial I have provided you with instructions to create and insert a simple drop down menu widget in the sidebar of your Blogger Blog.