Okay, so we ran into a bit of a problem while installing a mobile component for a client’s website. The component was awesome, except for the fact that there was no setting to disable the categories for the site being turned into menu items. Yuck! Not what I want at all. These categories don’t show on a desktop, just on mobile devices. Why? No clue. I’m no CSS guru, but I know a little bit.
So, how in the world do you view the source of a mobile website to find the id or class of the pain in the rear div tag? I never knew that, but on Google you can find ANYTHING!
Here we go. To view the source from an iphone/itouch,
1. Go to the site you want the source of and bookmark it.
2. copy the code from this site to your clipboard…http://ole.michelsen.dk/viewsource/bookmarklet.min.js
3. go to your list of bookmarks and click “Edit”
4. click the site you want the source of and delete the current url field.
5. paste the code from your clipboard into the now empty url field and save
6. now visit the site via your new bookmark.
Voilà! Now you have html source code from the site. I then found the offending div id and added display:none to my css file.
Easy peasy! No more eye sore category menu!
Written By: Izaak Hale