Adding a pdf or document to your wordpress site

Loading a pdf into WordPress using Divi

  • Log in to the wordpress admin
  • Select the page or post you want to edit
    (either by going to Pages/Posts or by clicking edit page when you are viewing in the front of the site)
  • When you are in Edit Page click on the content module you want to edit
    (click on the three horizontal bars on the module)
  • Place the cursor where you want to add the pdf link within the content
  • Click on add media
  • Select the pdf file you want to upload
  • Once the file has uploaded edit the Title as this will be the words that appear in the link
  • Save & Exit the module
  • Update the page
  • If you want the link to open in a new window and therefore users don’t come away from your site you need to change the link setting to Open link in the new tab
  • Go back to the link you created
  • Click on the pencil/edit icon
  • Tick the Open link in the new tab box
  • Save and update the page again
  • Now the link will shows on the page

N8tive web design is a North London Web Design company creating web sites that build business

Posted in Uncategorized | Comments closed

Logging in to the WordPress site admin area

  1. You will have been given a web link and log in details to access your WordPress dashboard. The dashboard is where you can administer your website, add and edit content, upload images, video etc.
  2. The link will usually it takes the form of http://www.yourwebsitename.com/wp-admin.
  3. Just follow that link and enter your username and password details to access the WordPress dashboard for your site .
  4. You will then be presented with the WordPress dashboard which allows you to carry out editing on your site.
  5. Don’t be daunted just read Understanding the WordPress dashboard to see what’s going on
Posted in Wordpress | Comments closed

Creating Graduated Backgrounds using CSS

Specifying a top to bottom gradient using CSS, in this case grey to white

/* IE10 Consumer Preview */
background-image: -ms-linear-gradient(top, #CCCCCC 0%, #FFFFFF 100%);

/* Mozilla Firefox */
background-image: -moz-linear-gradient(top, #CCCCCC 0%, #FFFFFF 100%);

/* Opera */
background-image: -o-linear-gradient(top, #CCCCCC 0%, #FFFFFF 100%);

/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #CCCCCC), color-stop(1, #FFFFFF));

/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(top, #CCCCCC 0%, #FFFFFF 100%);

/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to bottom, #CCCCCC 0%, #FFFFFF 100%);

Posted in CSS, Wordpress | Comments closed