El Code Snippet

Take and Use ... It's cool!

Craigslist: Introduction

Craigslist (http://craigslist.org) is one of the web most used sites. You can post a job, get a listing of cars in you area, provide a service, find a rental property, and so on.

Developing the HTML code for an ad, though, can be quite challenging if you are not aware of the limited HTML syntax that is available to you.

Let's take at the elements available to you when creating a Craigslist ad.


  1. Develop a working design of what you want your ad to look like. You can use pencil and paper, Microsoft Word, Adobe Photoshop, etc. to help you visualize what your ad will resemble on Craigslist.
  2. Use the code guideline below to help you place the various components (heading, images, links, etc.) you noted in your design to help you create that perfect Craigslist ad.
  3. Go to http://craigslist.org, login in to your account, create an ad, experiment with the code, and when your ready, post your finished product.

First thing's first, though ... how about getting a couple of basic Craigslist tags out of the way.

Syntax: <p> </p>
Meaning: The paragraph tag creates a paragraph element on your Craiglist page
Example: Today, I want to share with you the last innovation in coffee makers the US has ever produced!
HTML Code: <p>Today, I want to share with you the last innovation in coffee makers the US has ever produced!</p>
Syntax: <b> </b>
Meaning: The bold tag makes the text inside the <b> tag bold
Example: Hi, this is bold text!
HTML Code: Hi, this is <b>bold</b> text!

Figure 1

Create an Craigslit HTML file using the <p> (paragraph) and <b> (bold) tag to create a cool looking sentence.

              <p>I hope you have a <b>fantastic day!</b></p>

Your turn. To experiment hacking this code, go to https://repl.it/Ioh6, click the run button located at the top and watch the system do its thing!