Content Management

Content Management

01

Help! The Text Doesn’t Look Right

Unfortunately, the design view for page content sometimes doesn’t render text as you would expect.

Foreign formatting

When copying and pasting text from Microsoft Word or another program, sometimes a whole lot of random formatting comes along for the ride without you realising and this may cause havoc.

If you are creating a new page/article using text from elsewhere, the safest way to do this is to paste the text into Text view:

Divi

  1. Copy the text to the computer clipboard (ctrl-c)
  2. Enter the Visual Builder mode and hover over the section you want to edit
  3. Click the ‘Module Settings’ icon
  4. Click the ‘Text’ tab at the top of the text content area
  5. Paste the text here
  6. Click on the ‘Visual’ tab to go back to the design view
  7. Select the text and apply the paragraph style called ‘paragraph’
  8. If you had multiple paragraphs, add these back in

Beaver Builder

  1. Copy the text to the computer clipboard (ctrl-c)
  2. Click on the relevant page and scroll down until you find the textbox that contains the text to you want to edit
  3. Click the ‘Text’ tab at the top of the text content area
  4. Paste the text here
  5. Click on the ‘Visual’ tab to go back to the design view
  6. Select the text and apply the paragraph style called ‘paragraph’
  7. If you had multiple paragraphs, add these back in

 

If you have tried all that and are about to throw something, then drop Husk a line. We can help.

02

Tips For Writing Web Content

People don’t read large chunks of text on websites. Typically, people scan across the screen looking for a piece of information that stands out to them. Because of this, here’s a few great tips to consider when writing content for your website:

  • Keep it short and concise
  • Is it scan-able i.e. easy to read?
  • Use headings and subheadings to clearly mark the content
  • Use bullet points when possible
  • Include a photo or diagram here and there to keep things interesting

03

Glossary of Common Terms

Website Specific Terms

Browser: This is Google Chrome, Firefox, Internet Explorer, or Safari.

URL: is a reference (an address) to a resource on the Internet. This appears in the address bar of your browser. e.g. https://www.google.co.nz/

SEO: Search Engine Optimisation is a methodology of strategies, techniques and tactics used to increase the amount of visitors to a website by obtaining a high-ranking placement in the search results page of a search engine (aka Google)

HTML: is the code that web pages are based on. HTML commands your web browser to display text and graphics in orderly fashion. HTML uses commands called ‘HTML tags’ that you can review in the “Glossary of Basic HTML” section of this document.

Social Media: the broad term for any online tool that enables users to interact with thousands of other users. This most commonly refers to Facebook, Twitter and Instagram but includes many others.

Download: Downloading is a broad term that describes when you make a personal copy of something you find on the Internet or World Wide Web.

Field: An area that you can use to enter information into a form.

General Computer Terms

Screen shot: (sometimes called a screen capture) is an image of a computer desktop that can be saved as a graphics file.

Your Desktop: is the computer display area that you can see on your screen when you have no programs open.

Email Client: is the program you use to send and receive your emails. Some common ones are Outlook, Gmail, Hotmail and Yahoo.

Copy: can mean one of two things. 1) It’s duplicating text, data, files, or disks, producing two or more of the same thing. Use the keys Ctrl + C to copy something. 2) a graphic design term used to mean the content of words and images that will be used on the website.

Paste: Do this after copy. Use the keys Ctrl V to paste something.

Click and drag: In some situations, you can use the left button of your mouse to click on an object and, without releasing the button, drag it to a new place. Release the button.

04

Glossary of Basic HTML

For advanced use, this is for use in the HTML view of Pages, Web Apps and Modules. The HTML ‘tags’ are here in the gold colour. Two almost-matching tags are required, the opening tag, which denotes the start, and the closing tag which denotes the end.

<p> use paragraph tags for body copy text </p>

<strong> use strong tags to make text bold (use this inside p tags) </strong>

<h1> use heading 1 for page heading </h1>

<h2> use heading 2 is sub heading </h2>

<h3> use heading 3 is used for intro text </h3>

<br /> use line break to add line space

<img src="/images/name.jpg" /> The code for placing an image in a page. This is an exception as it does not require a closing tag.

<ul>
<li> use listing tags for bullet points </li>
<li> use listing tags for bullet points </li>
<li> use listing tags for bullet points </li>
</ul>

<div> div is the opening and closing tag of a data container - we give divs names, classes or IDs so we can style them </div>

<section> section is like div, a way of breaking up data into workable spaces </section>

<!-- use ‘commenting out’ to hide code --!>