iPhone Life magazine

Another revolutionary multiplatform utility by me: add "find in page" support to most mobile web browsers!!!

I’ve long been complaining about the lack of any “find in page” functionality in most mobile Web browsers. Now that I’ve played a bit with JavaScript scriptlets, I can proudly present a working solution to this problem.

All you need to do is, independent of the Web browser you use, add the following favorite:

javascript:var searchText=prompt("Enter the text to search for","");document.body.innerHTML= document.body.innerHTML.replace(new RegExp(searchText,"gi"),"<font size=10 style='color:blue; background-color:yellow;'>"+searchText+"</font>")

You can name it anything and can also safely change the following parameters:
the text “Enter the text to search for”,
10 after size (you can use any number here; the larger the number, the bigger characters it will use)
blue after style and
yellow after background-color (any English color name will do here) to your liking.

After having done this, when you’re on a page where you’d like to search an expression for, just go to Favorites, click / tap this one; in the pop-up dialog, enter the expression to search for and press OK. All the occurrences will be highlighted.

How should you add this favorite?

Click THIS link. (A technical note: the functionality of the scriptlet itself has nothing to do with the go.to website. I’ve only used it as it’s really-really short. I could have used any else Web address; all you need to do is adding a question mark after the address and, after that, copy the scriptlet itself.) After this, depending on your (mobile) platform, do the following:

1. iPhone

1.1 the built-in Safari


a. You’re taken to the website. If you take a look at the URL in the address input field, you’ll see the actual code is still preceded by “http://go.to/?”. Nevertheless, we’ll remove it after adding the favorite.



b. Add it as a standard favorite (press the + icon at the bottom and select Add Bookmark). You can name the new favorite anything; in the screenshot below, I’ve named it “Find txt”:


Tap Done.

c. After having returned to the webpage, go to favorites (tap the “book” icon) and tap the Edit button:



Tap the just-added favorite (here, it’s the second from the top).

d. Go to the second row; now it’s editable, unlike when it was first added. The screenshot below shows the cursor being at the end of the address:



e. Tap and hold the URL area (as you’d do with positioning the cursor in the main address entry field of Safari) and scroll to the beginning of the address, just in front of the “j” of “javascript”. The screenshot below also shows the magnifying glass emphasizing the position of the cursor:



f. Now, on the virtual keyboard, press Delete several times until everything is deleted in front of “javascript”. The URL should be the following:


Tap Done.

g. You’re taken back to the previous Web page. Let’s give our tool a quick try: try to find all occurrences of, say, “Web”. To do this, bring up Favorites again (the “Book” icon) and select “Find txt” – as you’d select a favorite. You’re presented a text entry dialog, where you can directly enter the text to search for and highlight:



h. After pressing OK in the text entry dialog, all occurrences of “Web” have been highlighted:



Pretty nice, eh?
1.2 iPhone with a third-party Web browser

Unfortunately, the following browsers, while they do allow editing URL’s right when you add them, don’t work as expected: Journey Web Browser 1.0 and fgBrowser 2.5. While they do allow saving modded favorites, nothing happens when you click in the first and “The URL can’t be shown” is displayed in the second.

You will want to prefer the built-in find-in-page capabilities of Perfect Browser 1.0, iCab Mobile 1.5 and Air Browser 1.1. (Note that the last two don’t allow for any kind of favorite URL editing at all.)

All in all, I don’t know of any (quality – I haven’t tested the lower-quality ones in this respect; for example, QuickSurf 1.2, Full Screen Web Browser 1.1.1 and Wide Web with Twitter 2.3.1, which all support favorite URL editing) third-party iPhone browser to support this scriptlet (or scriplets at all).

Finally, VanillaSurf 1.2 (my favorite third-party Web browser for iPhone OS 3.0 – too bad it doesn’t support in-page searching; that is, it severely lacks URL editing capabilities) and CaizerWeb 1.0.2 don’t support URL editing and, when passed, direct javascript URL’s in the address field are not accepted. Multi-Full Browser 1.1.0 doesn’t support URL editing either.

Note that, as my iPhone OS 3.0 phone isn’t jailbroken, I couldn’t test whether the manual editing of favorite databases is of any use – as is the case with Internet Explorer Mobile under Windows Mobile.

(Note that the version numbers above reflect the current (06/19/2009) state of all these browsers. By the time you read this, they may have changed.)

2. Windows Mobile

With Internet Explorer Mobile, you’ll need to do a bit of hacking as you can’t save scriplet bookmarks. Don’t be afraid: it’s easier than you may think.

Let’s start with adding any favorite. It can be anything – we’ll delete the URL from it afterwards.

Select Menu / Add to favorites:



Here, I’ve renamed the favorite to “Find txt”. No, don’t try to edit the URL and save the one starting with JavaScript: it’ll show an error:



Instead, on your handset, go to the \Windows\Favorites folder and edit the favorite URL you’ve just created. If you name the favorite “Find txt”, then, the file will be named accordingly; that is, Find txt.url.

In the second row, after “URL=”, just change the previous URL (here: http://go.to/) to the new one. Paste the new one. To make your life easier, I recommend the WinCE file system plug-in for Total Commander and doing all this on the desktop.
In the first screenshot below, I’ve shown the to-be-deleted text highlighted; in the second, after replacing it with the above scriplet:




Make sure you store the changed file back to your phone. Now, fire up any Web page you’d like o highlight the occurrences of a word on, go to your favorites and select the finder scriplet. A dialog is displayed:


and click OK (left softkey). The results speak for themselves:




On other operating systems, you will need to do roughly the same – that is, upon saving the favorite, just chop off the leading http://go.to?.
 

UPDATE (06/21/2009 1:36 CET):
1.) There are some other scriplets HERE (thanks to “AttackOfThePwned” at TouchArcade for pointing this out); among other things, another highlighting one even capable of counting the number of hits and scrolling to the first occurrence. I haven’t tested it for compliance. Note that the tutorial only states synching these bookmarklets via a desktop Safari; of course, they can also be (directly) deployed on your iPhone - or, if they’re compatible – again, I haven’t checked – under other operating systems.
2.) As has been explained in many of my iPhone- and Windows Mobile-related articles, the built-in Safari has a shortcoming compared to for example Opera Mini: it doesn’t allow for quickly scrolling to the bottom of the page. (Without external help like this, it may be VERY hard to scroll down to the bottom of a long page to, say, check out the latest posts in a forum like that of DPReview). I’ve managed to fix this issue too. All you need to do is use the following scriptlet:

javascript:window.scrollTo(0,100000)

To quickly deploy it, just click THIS and do what’s explained in my former article.
 

UPDATE (12/01/2009): I’ve posted an entire tutorial to adding scriplets. In addition, the new article has a lot of additional goodies:
- Find in page with Next functionality (!)
- New versions of the lifeclever.com scriptlets deployable right on the iPhone, even in Safari
- A complete report on all (scriptlet-capable) iPhone Web browsers’ compliance of handling purely Javascript (clickable) links (that is, ones that don’t start with http:// but with javascript: )

Please see http://www.iphonelife.com/blog/87/complete-tutorial-video-extend-functionality-your-iphone-web-browser  

 

Topics:
Email icon
Want more? Get our weekly newsletter:

Werner Ruotsalainen is an iOS and Java programming lecturer who is well-versed in programming, hacking, operating systems, and programming languages. Werner tries to generate unique articles on subjects not widely discussed. Some of his articles are highly technical and are intended for other programmers and coders.

Werner also is interested in photography and videography. He is a frequent contributor to not only mobile and computing publications, but also photo and video forums. He loves swimming, skiing, going to the gym, and using his iPads. English is one of several languages he speaks.