Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Guide to editing HTML

15 views

Published on

Responsible for updating a website or blog? Would you like to use the HTML options for editing/updating content? This very short guide provides a quick reference to using HTML.

Published in: Internet
  • Be the first to comment

  • Be the first to like this

Guide to editing HTML

  1. 1. A quick guide to editing HTML by Simon Pittman With websites and blogs, you can usually edit content as it would appear to visitors – similar to how you edit a document in Microsoft Word. Sometimes it may be easier to edit the HTML for your post – for example when experiencing problems editing a post or fine tuning how content appears. This is not intended to be a comprehensive guide to HTML – rather to act as a quick reference that you can use to edit HTML for your blog. If you have any questions, comments or would like further help, e-mail: simon@libraryplayer.co.uk Any text/additional HTML between an opening (e.g. <p>) and closing (e.g. </p>) tag will have that field apply to it. For formatting, e.g. setting the font, etc. you may also use CSS. Task HTML to use Displaying a paragraph of text. <p>Add paragraph text here.</p> Displaying a blank line. <br /> (some services will also accept <br>) Displaying a main heading. <h1>Heading name</h1> Displaying sub-headings. <h2>Sub-heading name</h2> You can also have levels of headings, from 3 to 6. Web link <a href=”web address”>Any text within here will link to the website</a> For example: <a href=”http://www.libraryplayer.co.uk”>Library Player website</a> For e-mail links, use mailto instead of http or https, e.g. <a href=”mailto:simon@libraryplayer.co.uk”>Library Player website</a> Changing the font style (You may find this easier to do from within the visual editor) <font face=”font name”>Any HTML/text within here will have the font applied</font> Some editors may prefer you to use CSS instead, e.g. <p style=”font-family:font name”> The font you use depends on whether the visitor's web browser has that font installed. Copyright © 2019 Simon Pittman Page 1 of 3
  2. 2. Task HTML to use Bold text <b>Any HTML/text within here will appear in bold</b> Displaying an image (NOTE: the image must be stored on the web server/hosting, or somewhere accessible online) <img src=”image filename or web address”> or <img src=”image filename or web address” /> For example: <img src=”simon.png”> <img src=”images/simon.png”> (stored in a sub-folder) <img src=”http://www.example.com/images/simon.png”> Displaying a table. (In addition to using a table to display information within a table – a table can be useful for simple layouts of items). <table> <tr> <td>Row 1, Column 1</td> <td>Row 1, Column 2</td> <td>Row 1, Column 3</td> </tr> <tr> <td>Row 2, Column 1</td> <td>Row 2, Column 2</td> <td>Row 2, Column 3</td> </tr> </table> You can have as many rows (<tr>) and columns (<td>) as you require. You can also add any additional HTML within each column (e.g. paragraphs, images, etc.). Many HTML fields covered have additional options for customising, etc. - which are beyond the scope of this guide. Some common errors made when editing HTML... ✔ Not closing tags often leads to errors (e.g. including <P> but forgetting to close with </P>). ✔ Filenames – including names of images and web pages are usually case sensitive – for example “SIMON.PNG” and “simon.png” will be considered two separate files. For this reason its best to use lowercase for all filenames – and make sure any web links/images work and display properly after editing. ✔ Ensure images, downloads, etc. on your website are available on your web hosting or somewhere online (e.g. Dropbox) – and that any links to it are not referring to the location of your document on your computer. ✔ Preview any changes before saving – and after editing check your web page – do all your web links work correctly? Are pictures displaying properly? If possible, check using a few different web browsers (e.g. Firefox, Chrome and Internet Explorer). ✔ Remember – just because it loads on your computer, and looks good on your computer, doesn't mean it will be the same for everyone else! Copyright © 2019 Simon Pittman Page 2 of 3
  3. 3. Books by Simon Pittman Available to order on Amazon at: https://www.amazon.co.uk/Simon-Pittman/e/B07D7WPTH5 Would you like further help with your website? Available for freelance web work – e-mail: simon@libraryplayer.co.uk Involved with a club or charity? Help and support running your organisation – join the Member Manager Plus group for FREE at: www.facebook.com/groups/MemberManager Looking for help with: launching applications? Managing your membership? Audio/broadcast solutions? Keeping track of your to-do lists? Try our software for free at: www.libraryplayer.co.uk Copyright © 2019 Simon Pittman Page 3 of 3

×