Coding For Dummies
Book image
Explore Book Buy On Amazon

What’s your favorite news website? By following a few steps, you can see and even modify the code used to create that website. (No need to worry, you won’t be breaking any rules by following these instructions.) Although you can use almost any modern browser to inspect a website’s code, these instructions assume you’re using the Google Chrome browser.

Open your favorite news website using the Chrome browser and then follow these steps:

Place your mouse cursor over any static fixed headline and right-click once, which opens a contextual menu. Then, left-click once on the Inspect Element menu choice.

Place your mouse cursor over any static fixed headline and right-click once, which opens a contextual menu. Then, left-click once on the Inspect Element menu choice.

Source: huffingtonpost.com

If using a Macintosh computer, you can right-click by holding down the Control key and clicking once.

The Developer Tools panel opens at the bottom of your browser. This panel shows you the code used to create this web page! Highlighted in blue is the specific code used to create the headline where you originally put your mouse cursor.

Look at the left edge of the highlighted code.

Look at the left edge of the highlighted code.

Source: huffingtonpost.com

If you see a right arrow, left-click once on the arrow to expand the code.

Scan the highlighted code carefully for the text of your headline. When you find it, double-click on the headline text.

Scan the highlighted code carefully for the text of your headline. When you find it, double-click on the headline text.

Source: huffingtonpost.com

This allows you to edit the headline. Be careful not to click on anything that begins with http, which is the headline link. Clicking on a headline link will open a new window or tab and load the link.

Insert your name in the headline and press Enter.

Insert your name in the headline and press Enter.

Source: huffingtonpost.com

Your name now appears on the actual web page. Enjoy your newfound fame!

If you were unable to edit the headline after following these steps, visit Webmaker for an easier, more guided tutorial. It’s a foolproof guided version to edit code on a page. It’s a teaching aid that shows that any code on the Internet can be modified. On that page, click the yellow Activate X-Ray Goggles to see and edit the code on the webmaker.org web page. Try again to hack your favorite news website by following the “Remix Any Webpage” instructions.

If you successfully completed the steps above and changed the original headline, it’s time for your 15 minutes of fame to come to an end. Reload the web page and the original headline reappears.

About This Article

This article is from the book:

About the book author:

Nikhil Abraham is the CFO of Udacity, an education company that teaches technology skills that help launch or advance a career. Prior to joining Udacity, Nik worked at Codecademy where he taught beginning coders across a variety of professions. He is also author of Coding For Dummies and Getting a Coding Job For Dummies.

This article can be found in the category: