Jun 7, 2017

How To Add A Search Box To Mobile View Of Blogger

The search box is the first thing your visitors want to see. So in this post, I will share a well-optimized search box for blogger mobile view which will work on all mobile phones like the one on this blog.
Add A Search Box To Blogger

How to add search box in blogger mobile view:

1. Go to blogger dashboard and navigate to layout:

2. Click on Add a gadget > Html/javascript. 

3. Copy below code and paste it into Html//javascript window:
<!-- Search box for blogger mobile by uchetechs.com -->
<form id="searchbox" method="get" action="/search">
<input name="q" type="text" id="search-in" size="19" required />
<input name="m" type="hidden" value="1" />
<button type="submit" class="_54k8 _56bs _56b_ _56bw _56bu" id="u_0_1" data-sigil="touchable"><span class="_55sr">Go!</span></button>
form#searchbox {
position: relative;
left: -40px;right: 0px;margin-left: 24%;margin-right: 24%;width: 85%;}button#u_0_1 {position: relative;width: 45px;height: 25px;color:white;background:#4491f0;border-color:#4491f0;}input#search-in {height: 20px;}</style><!-- Search box for blogger mobile by uchetechs.com -->

4. Now click on save and you are almost done but it will show up in desktop so you have to hide it from desktop and show it only in mobile view, follow next step to move ahead!
5.Edit the mobile search box gadget which you added now and search for the widget id, see below image for instance.
6.Note the widget ID and go to Template > Edit Html: 

7. Click on Jump to the widget and click on the widget ID of search box gadget which you found in step 5
8.After finding the widget type mobile='only' beside locked='false'.
9.Click on save the template and you are done.

If the search box still fails to appear in mobile view of your blog then go to template > Click on Customize mobile template icon > Switch default template to custom and click on save.

Open your blog by using this link https://uchetechs.blogspot.com/?m=1{use your own blog url} to see your search box. This search box will work on all mobile phones and will work fast.

Hope you like this article and it was helpful to you if you have any question you can use the comment box below.

Send me a message on Messenger if you need my help.

Get Our Hottest Updates via SMS. Kindly SMS FOLLOW UCHETECHS to 40404 on Any Network, It Is Totally FREE. Download Our Android App From Playstore HERE
To Submit Your Guest Post Or Sponsored Article, Click HERE. For Latest Tips and Tricks, Join Our Telegram Channel Chat
uchetechs blog-bg

Get Latest Games and Apps From UcheTechs

facebook twitter gplus pinterest rss

0 comentarios:

After dropping your comment, keep calm, it may take minutes before it appears after moderation.
Your comment(s) are appreciated.

You want to get notified when i reply your comment? Kindly tick the Notify Me box.