Manage your Own Blog with this Drupal Tutorial for Beginners 4


Drupal Tutorial for BeginnersI don’t know how many times I have come across web owners who are frustrated because they have employed the services of a web developer, have a nice looking site up but are now stuck with how to add content themselves or how to edit existing content.

This post is therefore for anyone who already has a Drupal blog or is wanting to add a blog to their Drupal site and would like some help with adding and editing content.

A Tutorial for New Drupal Bloggers

This tutorial includes tips on:

  • How to add a post
  • How to insert images into a post
  • How to insert hyperlinks
  • How to decide on titles for your posts
  • How to set options for each post
  • How to keep a post hidden until you are ready to publish it
  • How to edit posts
  • How to delete posts

Note: This tutorial assumes that you already have a Drupal blog already set up. However, if you are looking, instead, for some help on HTML & CSS, then I suggest that you look at my review of an online web design tutorial by clicking here. Otherwise, read on.

How to Add a Post to Your Drupal Blog

  • Login as admin by typing the following in the address bar of the browser:

    www.yoursite.com/user

    Enter your usual admin username and password (easiest if you copy and paste the password).

    If you don’t know your admin details, your original developer can provide you with this information.

  • From the administration dashboard click on ContentAdd Content

Adding Content

  • Select Article as the content type.

Add article for your blog post

The “article” content type is used for blog posts. You will now be presented with a screen where you can type and format your blog post (article):

Create Article Screen

 

How to Enter Content for the Blog Post

As you can see from the screenshot above, there are a number of fields that need to be filled in, in addition to the actual content.

1. The Title

Enter your Title using the information below as a guide.

The title is very important because Google (and other search engines) will look at the title, as one indicator, to determine if your post matches someone’s search.

If you entered “dogs” as the title, for example, the word “dogs” would be too generic to trigger a post on training dogs in the search results. One word search terms are too competitive and too general, so it is very hard to rank well for them in Google.  If the title were “training small lap dogs” instead, this would be more descriptive and competitive 

So the trick is to find a title that is specific to the content of your post but not too short or too lengthy. I usually find 2 to 4 word phrases work well but this is entirely optional. And I usually consult Spencer Haw’s Long Tail Pro tool as well as the Google Keyword Tool, now the Google Keyword Planner when deciding.

Keyword Research

2. Text Format

Check Text Format under the Body block screen.

You only need to do this with your first post as I have made recommendations below with respect to what I think will make your posts easier to format from now on.

Underneath the Body block you will see a drop down list with choices for the text format:

HTML Editor

If this remains on Full HTML you can have access to all of the formatting options, shown by icons just above the Body box.

If you choose a different text format, from the drop down list, these options are no longer available.  So, I recommend leaving text format as Full HTML.

3. The Body

Use the Body block to enter the content of your post.

You can style how you want the text to look via the icons above the Body block. I recommend using the Paragraph style for normal sentences:

WordPress editor

You can type your content directly into this box or you can use the “copy from word” options by clicking on the Word Icon as shown below. This brings up an extra window where you can paste your content that has been written in Word.  HOWEVER, I strongly advise against pasting directly from Word into your editing screen because you will end up with a lot of extra code that will slow down the loading of your pages.

 WordPress Editor

However, I usually find it just as easy to type directly into the Body block rather than copying, pasting and then re-formatting it, but this is an individual choice.

Conventions

Studies show that the following tend to work best to maximise reading of web content:

  • Paragraphs – black or dark font on white background.
  • Headings – own choice but should be a different colour than that used for hyperlinks.
  • Title case in headings (1st letter of major words capitalised)
  • Underlining reserved for hyperlinks

4. Inserting Images into your Post

There are 2 types of images that you can work with in your post:

  • Images that are inserted into the text
    You can include as many as you want here.
  • The Teaser Image
    This is one image that sits to the left of your post content when its summary appears with all the other posts on the main blog page.

We will look first at inserting an image into the post content.

Let’s assume that you wanted to enter some information about the products sold on your site. This might go under some text already entered and could include an image via the following steps:

  • Place the cursor where you would like to insert the image.

    Then click on the Insert Image icon.
    This brings up a new window that allows you to browse for an image on your computer or to select a graphic that has already been uploaded to your site.

    The best formats for images are files that end in:

    • .jpg
    • .png
    • .gif  (sometimes .. not as sharp)
  • Click on the Browse icon in this pop up window.

Insert Image

 You will see a listing of the images that are already on your site.

If you don’t want to use an image that is already on your site, you can click Upload to search for a new graphic that has been stored on your computer.

  • Click on one that you would like to insert and then position it. As soon as you click on a file name, you will see a picture in this popup window which helps you decide if that is the image that you want. Then click on Insert File.

    The next window allows you to format how you want it to appear and where you want it positioned. I am going to choose right from the Appearance tab which will make it sit to the right of the text in that section.

You can use these options to set space around the image and to assign it a border etc.

  • Enter the title and description information for the image.
  • Click Insert
    The inserted image might appear a long way to the right in the editing window but will display as required when you view the finished product by clicking Save.

N.B. You can save your post as often as you like; it won’t be visible to the public until it is published.

5. Inserting Hyperlinks into Your Post

Let’s assume that there is a line at the end of the text in your post and it is prompting readers to click on a link that you have provided. The link might read “Click here to see the details”. We can turn this line into a clickable hyperlink via these steps:

  • Make a copy of the URL that you wish to direct readers to. This might be another page on your site or it might be an external site.
  • Select the sentence that you want to turn into a hyperlink.
    In this example, that would be “Click here to see the details”.
  • Click on the icon that looks like a link in a chain; it is labelled Insert/Edit Link when you hold your mouse over it (see screenshot below).
  • In the Link URL window, paste the link to your destination page

Hyperlink text

You will now see the hyperlinked sentence change colour and it will now be a clickable link when viewed/published.

6. Other Useful Formatting Options

You can hold your mouse over the formatting icons to see a description of what they do. Many of them are virtually the same as you get in a Word document.

Icons for formatting

Others that you might not have come across before are:

  • Insert/Edit imbedded Media
  • Edit the source code (html)
  • Separate the teaser and body of this content
  • Preview

7. Teaser Summaries

Teasers consist of summaries of your latest  posts. Underneath each summary will be an option to Read More.

You can see an example of this in the screenshot of a blog below. It shows the first so many lines of the post followed by a clickable link, “Continue reading”. When readers clicks on that link, they get a dedicated page showing just that post.

 Teaser Images

You can determine what goes in the Teaser summary if you prefer Otherwise the first so many sentences of your blog post will be used. 

If instead you would like to write the Teaser summary yourself, just click on the Edit Summary link above the Body block.

 Summary\

This will open up a small box where you can type in a brief summary describing what the post is about. It is optional and only needed if you want to use this summary as the teaser on the main blog page instead of the default lines of text.  

I usually allow the system to take so many lines from the post or I insert a break tag by clicking on the icon shown below.

Insert break tag

If you are happy for Drupal to take sentences from your post as a teaser summary, you can just let the default option do the summary work for you.

Otherwise, you can decide where you want this break to appear by following these steps:

  • In the Body block, put the cursor at a logical place for the Read more link to appear.
  • Insert the break tag by clicking on the icon shown below.

The Teaser Image

  • Click Browse on the file uploader that appears under the Body block to choose a file that will be your teaser image:
  • Enter the Alternate Text.

    This will appear if someone turns off images on their browser and will display on some browsers when the mouse is held over the image.

This teaser image will automatically appear in the teaser summary on the main blog page.

It will also appear in the top left corner of the full post.

8. Keyword Tags

Tags are words or phrases can be used to categorize your posts and to help visitors, as well as search engines, find your posts.

Enter some tags, separated by commas.

Tags for blog

9. Option Settings for a Drupal Post

Under the Body block, you will see a list of options like so:

 Options

The only options that you really need to worry about are as follows:

  • The URL Path Settings

 Path for URL

Drupal automatically creates the URL path name for you from the title that you entered. If you want to have an extra-long title but want a shorter URL, then you can override it and enter a new URL via this window.

If you have a unique title that is very wordy, then I would definitely recommend overriding the default that has been provided. So in this case, you would un-tick the Generate automatic URL alias and change the URL alias to something that you prefer.

  • Blog Comment Settings

If you would like visitors to your site to be able to leave a comment about your post content, then leave this as Open, otherwise choose Closed.

If you allow comments, it makes your site much more interactive and encourages visitors to return to the site.

 Open comments

 

You can get a quick overview of comments that have been left via Content – Comments

You can make it the default that comments are held until you approve them. This can help you guard against spam.

 Sales notification

 You can reply to any of the comments entered by reading them beneath the post and then clicking on Reply.

  • Authoring Information

You can decide what you would like to enter as information about the author or you can just leave it as the default Admin if you like.

If you and a co-blogger or guest bloggers are each submitting posts to the blog, you might want the relevant names to appear here.

  • Menu Settings

    • Click on Menu Settings and then Provide a menu link. This will open up more fields to be filled in.
    • Enter a description.
    • Choose Blog as the Parent Item.  This will attach the post to the blog menu.
  • Publishing Options

I recommend leaving these boxes un-ticked until you are ready to actually make your post visible to the public. That way, you can work on your post all week in draft form if you like and then just publish it when it is ready to go live.

I recommend using the Preview option in the formatting icons as you are creating your post. There is a Preview option at the bottom of the page but it tends to give a somewhat distorted view, the former gives a much more realistic view of how the post will look except that your final version will have the teaser image showing.

 Preview post

When you click Save, it shows how this post will look with all images included.

When you are ready to make the post visible to the public, I recommend the following settings:
If your blog is a component within the rest of your site, I recommend clicking on Publish, as your front page probably displays only static information.  This will publish it to the blog section only
If your whole site is set up as a blog, then you would choose to promote it to the front page when you publish.

How to Edit a Post in a Drupal Blog

You can edit a post at any time via the Content menu link.

Then just look for the title of your post.

Click Edit.

If it is ever needed, you can also delete a post by clicking on Delete.

Troubleshooting Positioning Post Images

Blog editors are not normally as user friendly as some of the word processing editors.

If you ever have trouble positioning text that follows an inserted image, the following might help, but it does involve editing the code.

You can insert this 1 line of code following any image that is causing problems with layout of your text;

<p style=”clear: both;”>

To do this:

  • Click on the Edit Source Code icon:

 HTML Icon

  • Scroll down until you see the image name that has been inserted.
  • Paste the line of code, given above, underneath the line of code that contains the image name.

Latest Blog Posts

It is very useful to provide readers with a listing of your latest posts.

Recent posts

For this you can create a new block and specify that it appears in the sidebar and that i

t displays the most recent posts. (This could be the subject of another tutorial in the future.)

This would result in the sidebar having a block that automatically updates with clickable links to the last 5 posts published (you can set how many).  It can be configured to display the titles of the posts in these links.

~~~~~~~~~~~~~~

I hope that this guide has been of some use. If you are a seasoned blogger then you would already know all of this but if you are just starting out then this guide might be able to springboard you past some sticking points.

 

Follow my blog with Bloglovin

 

Teaser image: “Blog Signboard For Blogger Website And Blogging” by Stuart Miles, from http://www.freedigitalphotos.net


Leave a comment

Your email address will not be published. Required fields are marked *

CommentLuv badge

4 thoughts on “Manage your Own Blog with this Drupal Tutorial for Beginners

    • Glenys Post author

      I agree with you Emily and especially so for anyone just starting out. This is one of the reasons why I decided to write a Drupal tutorial for beginners. Many clients and others have expressed confusion with adding and editing content when a newly-developed Drupal website has been handed over to them. If there is demand, I will write a similar tutorial for WordPress.

  • Michelle

    Anyway,

    I’m a new reader to your site Glenys. I found you on niche pursuits dot com by Spencer Haws – I’m new to his site too. I’m studying everything I can on niche pursuits about keyword research, and now learning great ‘tips’ on your site as well. I found the the udemy dot com site here on your site – “How to create your own website” and installing wordpress, etc… I actually have never put up a website before, and I see you show people how to setup a drupal site. Does the Udemy Course show the basics like you do for drupal like – hyperlinking and inserting content and post and pages? I think it does from what I can tell reading and reviewing it but, just want to make sure…

    I put the same list down below that you are showing above as an example.

    Thank you and have a great night!
    Michelle

    How to add a post
    How to insert images into a post
    How to insert hyperlinks
    How to decide on titles for your posts
    How to set options for each post
    How to keep a post hidden until you are ready to publish it
    How to edit posts
    How to delete posts

    • Glenys Grob Post author

      Hi Michelle,
      The Udemy course that you mention How to Create Your Own Website provides lots and lots of step-by-step guidelines, many more than I have included in this post on Drupal. Just checking today, over 1,000 people have now enrolled in this course and it has retained its 5 star rating.

      I like the fact that it takes newbies through the whole process of getting a domain name, hosting and then setting up WordPress. In addition, it comes with video instruction which makes the lessons so easy to follow.

      I love working with WordPress myself and think it provides a very easy-to-use platform for both beginners and experienced web owners. Plus, it can be used for setting up a blog by itself or a complete website. In my view, WordPress is much easier to use than Drupal.

      There are several sections in the course; the 6th section covers adding content, inserting images etc. By the way, WordPress is very easy to hide until you are ready to show your site to the world. Similarly, you can create posts and keep them in draft mode until you are ready to publish them.

      The student comments on the site can give you additional insights into the course as well Michelle. For example, one person provides this feedback: “I was extremely impressed by Jennifer’s course. It’s incredibly detailed and would be perfect for a complete newbie, ….”

      If you enroll in the course, please let me know how it goes. I would love to see the site that you create as a result.

      Thanks for stopping by and reading my blog Michelle. I look forward to hearing from you after you start your course.