How to add custom external link to your Blogspot blog's menu

This is something beyond content and photo creation for your food blog, but it's necessary for you blog owners to further customize your blog, especially if you want to put a link back to your main/other website from your blog at blogspot/blogger.com. The good example would be this very blog, which I have moved from its previous location at blogspot (epicurina.blogspot.com), into becoming a sub-domain of my own domain Epicurina.com (blog.epicurina.com).

Since this is a hard-coded HTML, expect the changes to be lost when you change the template of your blog; but don't worry because this is what this page is all for: to remind you and myself on how to add the custom link into the Blogspot blog's menu.

Adding custom external link to you Blogspot blog's menu

This is a code edit to add custom (and permanent) link to your menu bar, which acts as a link to a specific web page (i.e. external link to your other website), instead of opening a blogspot made page.

1. Create "Pages" widget in "Design" - "Page Elements", to create a menu bar, as a base for your custom link editing
2. Open "Design" - "Edit HTML" - Click on the "Expand Widget Templates"
3. Search for "Pagelist[x]" - where "x" is a number (1,2,3,etc.), and remove the brackets
4. Add following line between the end of the loop (</b:loop>), and closing of the list (</ul>)
   
   
   1. </b:loop>
   2. <li><a href='[website URL]' title='[text appear on mouse over the link]'>[Link Title]</a></li>
   3. </ul>
5. Save, and your blogspot blog now should have its custom link on the menu bar
6. Finished!

p.s.: for better location of the code location and live example, please refer to the screenshot below:

Good luck! (bay)