How to find things in Blogger's Theme editor

<b>This article explains how to find things (gadgets or text) in the Theme editor in Blogger.</b> <br /><b><br /></b> <b><br /></b> <br /><div style="clear: both;"></div><a name="more"></a><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipHAcL0huNflaTWvIWM5td08UKGaNU384Aza7cCjkOJmLKHcz06y66EzGpC7rJ_uxDUcEv6DYm0SZq8nn96E-8LFrT9IExLtjCm3k-YqYb_vdDRHNfevsP1xnzbuonAIFS7rKZLOXlc5U/s1600/edit-blogger-template-theme-control-instructions.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipHAcL0huNflaTWvIWM5td08UKGaNU384Aza7cCjkOJmLKHcz06y66EzGpC7rJ_uxDUcEv6DYm0SZq8nn96E-8LFrT9IExLtjCm3k-YqYb_vdDRHNfevsP1xnzbuonAIFS7rKZLOXlc5U/s320/edit-blogger-template-theme-control-instructions.png" width="320" /></a></div>Very often when you are editing your Theme in Blogger, you need to find particular text. <br /><br />For example, you might need to find all places where  "</head" appears, so you can add something to the very next line.   Or you might want to find the code for a particular gadget (aka widget), so that you can put a conditional-formatting statement around it.<br /><br />There are now two tools you can use to find items in the Theme editor: <br /><br /><ul><li>The Jump to Widget tool if you are looking for a Widget</li><li>The Find bar if you are looking for a text string.</li></ul><br />More information about using each of these is given below.<br /><br /><br /><h2>How to use the Jump to Widget tool</h2>First, you need to find out the exact name for the widget / gadget that you need to find the code for.    (See <a href="http://blogger-hints-and-tips.blogspot.com/2012/04/finding-gadget-id-value-for-widget-in.html">Finding a gadget's name</a> for a tip on how to do this).<br /><br />Then, inside the Theme editor (see Editing your Blogger Theme for how to get there), just choose the name you are looking for from the drop down list .   (Click the arrow beside Jump to Widget to see the items in the list):<br /><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgYCj1QOQ00GibvhQGs-N18RMFtTC3U1dPtrx7l3UgLb5Sx05evNOLgS0MPoMBLc-7xsdYzwHGGiVDItrTJergE873m4LkJTuRrx5HiXERipdUXEIznSI3wn7Wp6Fvs12sgkyZDFgY0sw/s1600/find-gadget-code-in-theme-template-editor-using-jump-to-widget.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="310" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgYCj1QOQ00GibvhQGs-N18RMFtTC3U1dPtrx7l3UgLb5Sx05evNOLgS0MPoMBLc-7xsdYzwHGGiVDItrTJergE873m4LkJTuRrx5HiXERipdUXEIznSI3wn7Wp6Fvs12sgkyZDFgY0sw/s640/find-gadget-code-in-theme-template-editor-using-jump-to-widget.png" width="640" /></a></div><div class="separator" style="clear: both; text-align: left;"><br /></div><div class="separator" style="clear: both; text-align: left;"><br /></div><div class="separator" style="clear: both; text-align: left;">Once you have chosen an item from the list, the template editing window moves to the place where this gadget is listed in the theme code.   It usually places it in the 2nd line of the editing window.  For example, in the picture below, I chose to jump to the Followers1 gadget.</div><br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_3hanSpLG1Ol_HMdqb9WRFXjTl2cvekl-JuGDBEVFOhiQV75V2bWL78DHywA7tKyFQRHQIHONwODK0PraWglhbV4CIooEdCwT3RV79kMKQeQ1utVaYGLAA8jcXdC598-l47PuvKqkT7Y/s1600/after-jump-to-gadget-choise-it-is-in-second-line-of-template-editing-window.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_3hanSpLG1Ol_HMdqb9WRFXjTl2cvekl-JuGDBEVFOhiQV75V2bWL78DHywA7tKyFQRHQIHONwODK0PraWglhbV4CIooEdCwT3RV79kMKQeQ1utVaYGLAA8jcXdC598-l47PuvKqkT7Y/s640/after-jump-to-gadget-choise-it-is-in-second-line-of-template-editing-window.png" width="640" /></a></div><br /><br /><br /><h2>How to find any text in the Theme editor</h2><h4><span style="font-weight: normal;">Click anywhere </span>inside<span style="font-weight: normal;"> the Theme-editor window:   this is the rectangle which shows the code in your Theme.    (It's important to click inside here first, or the next command will work differently)</span></h4><h4><span style="font-weight: normal;">On your keyboard, </span>press Ctrl/f<span style="font-weight: normal;">:   to do this, hold down the control (ctrl) key, and press the  </span>f <span style="font-weight: normal;">   key.</span></h4><h4><span style="font-weight: normal;">A </span><span style="font-weight: normal;">search bar<span style="font-weight: normal;"> will now show in the top right corner of the theme editing window - like this:</span></span></h4><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtf-Ww4hM3jy1GeUncH7KK1NMlZ11ODqLfwfnydksflRVT3pbL8wV3cKwt6JMy9Xi3zLywizfFyhmTdF0zB9Tcf6H4vqDocM2ykykGDG4TckI4crY87yOJUJ5ACCwne01wEVttYML9hRg/s1600/use-text-search-bar-to-find-words-in-template-editor.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="182" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtf-Ww4hM3jy1GeUncH7KK1NMlZ11ODqLfwfnydksflRVT3pbL8wV3cKwt6JMy9Xi3zLywizfFyhmTdF0zB9Tcf6H4vqDocM2ykykGDG4TckI4crY87yOJUJ5ACCwne01wEVttYML9hRg/s640/use-text-search-bar-to-find-words-in-template-editor.png" width="640" /></a></div><h4><span style="font-weight: normal;">Type the text </span><span style="font-weight: normal;">you want to find into the Search bar and </span><span style="font-weight: normal;">press Enter</span><span style="font-weight: normal;">.   </span></h4><h4><span style="font-weight: normal;">The cursor will move to the first time that the text appears.   </span></h4><h4><span style="font-weight: normal;">To find the next place where the text appears, click into the Search-bar and press Enter again </span></h4><h4><span style="font-weight: normal;">Repeat as often as you need to find the correct place.  </span></h4><div>When you are finished with searching, click the X button at the right hand side of the Search-bar to close it.</div><h4><br /></h4><h2>How to see the details inside a gadget or other piece of code</h2><div>You can now find any text that you need to find in Blogger's theme editor (previously called the Template editor).   </div><div><br /></div><div>But if you look carefully at the Theme-editing window you will see that there is sometimes a horizontal arrow in the left-hand side of the code, and that the line numbers jump - like this:</div><div><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvxW5F-U5Hw2rheOfqz1aKP28MWAGFNrtGFdpPCs9su-Ou4DP2iuN4De2biXkIx3J4icpgcah602-Q4cJSC5Z9cphfPItIwQRQVp3zPXdt5UHZYSxNw8I8Hh55tMXCMN52iqBbvRhvdpA/s1600/expand-arrow-in-theme-editor-replaces-expand-widgets-checkbox.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="184" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvxW5F-U5Hw2rheOfqz1aKP28MWAGFNrtGFdpPCs9su-Ou4DP2iuN4De2biXkIx3J4icpgcah602-Q4cJSC5Z9cphfPItIwQRQVp3zPXdt5UHZYSxNw8I8Hh55tMXCMN52iqBbvRhvdpA/s640/expand-arrow-in-theme-editor-replaces-expand-widgets-checkbox.png" width="640" /></a></div><div><br /></div><div><br /></div><div>This happens because some of the detail is hidden, to make the theme-code easier to work with.</div><div><br /></div><div>But you can use the arrow (called an expand-arrow) to see it all:  Click on it and you will see that it changed to a down arrow, and that the code window now shows some extra lines which were previously hidden.</div><div><br /></div><div>You won't always need to do this:   some template edits just say to find the code for a gadget and to put extra instructions before and after it.   But others need you to open up the gadget code and make changes inside.</div><div><br /></div><div><br /></div><div><br /></div><div><br /></div><div><b>Job done!  </b>You can now find gadget and text items inside your Blogger Theme - so you can continue editing it.</div><br /><br /><hr /><br /><h2>Related Articles</h2><a href="http://blogger-hints-and-tips.blogspot.com/2012/02/how-to-edit-your-blogger-template.html">How to edit your Theme in Blogger</a><br /><br /><a href="http://blogger-hints-and-tips.blogspot.com/2010/03/displaying-gadget-only-on-home-page.html">Applying conditional formatting to widgets</a><br /><br /><a href="http://blogger-hints-and-tips.blogspot.com/2012/04/finding-gadget-id-value-for-widget-in.html">Finding the widget-id for a gadget in Blogger</a><br /><br />

How to find things in Blogger's Theme editor

This article explains how to find things (gadgets or text) in the Theme editor in Blogger. Very often when you are editing your Theme i...

Read more »