WordPress tutorial

wordpress tutorial step by step

WordPress tutorial step-by-step.

We learned what the domain is, what is hosting and what is WordPress. We learned how to buy a domain, hosting and installing WordPress. It’s time to move on. In this WordPress tutorial, we will learn the following:

  1. Basics of work in the administrator interface
  2. Creating and publishing content
  3. Edit the layout of the website and content
  4. Additional options and settings

1. WordPress tutorial – Basics of work in the administrator interface

Log in to WordPress administrator interface

In order to be able to perform actions and adjustments in WordPress, you must log in to the administrator interface of the website. to access the administrator interface of the webpage that we do we add the suffix “/wp-admin” or “/wp-login.php “to the URL of your website’s homepage. Something like this www.your-domain.com/wp-admin. Of course in this example instead of your-domain goes the address of your website.

link to login page

This address contains an authentication form that is used to enter the administrator’s web site interface.

wp login page

Once you have entered the correct information, and click on Log In, you have access to WordPress where the user can continue working. In the same way, the system will connect to other users who have the right to do so.

When authenticating, WordPress offers the option of permanently memorizing data entered ( Remember Me ) so that users do not have to enter each time when they want to access the site’s administrative interface. The password memory option can save you a lot of time, but it should be used with caution. Keeping this in mind, it is not desirable to use it on a computer that is used by multiple different users because then they can access your website.
If you forget your password, you need to click the “Lost your password” link. By clicking on this user will be redirected to a form that requires a username or email address that the user has registered on the website. After that, you need to click on the “Ask a new password” option, which will initiate the reset password process by giving the user an email address that will allow them to create a new password.

Lost your password

 

Dashboard

The dashboard is the central place for WordPress. If you are an administrator, so the person with the greatest rights has access to all available parts that are mostly not available to other users. With them, you can add new and edit existing content, upgrade your page with plugins, tools, create new users, and more. Depending on what you want to add to your website, you will select a specific item from the menu.

Dashboard

Dashboard

At the first signup, a welcome page informs you about the version of the program. During the visit, a box appears that offers options for the possible start of page editing and suggests initial steps. The frame can be left as a reminder during operation or hidden. The dashboard provides information about the current state of the page that is organized in several view frames: At a Glance, Quick Draft, WordPress Events and News,  and Activity. A brief overview informs about the number of posts, the number of pages and comments, and the version and theme of the program currently being used.  Within a Quick Draft, it is possible to record text for later publication. The Activity Box informs about recent postings and comments. The WordPress Events and News framework provide information on new developments in the program and upgoing events. Each frame in the upper right corner has an arrow that can close or reopen it. It is also possible to move frames using the mouse. Additional frame options are offered by selecting the Screen Option on the top right of the dashboard. Use the Screen Options tab to choose which Dashboard boxes to show.

In addition to the Screen Options, there is a Help option that provides information about the contents of the page and helps you navigate the page.

The dashboard is divided into three basic parts: the WordPress toolbar, the Main menu to the left, and the main control panel display with changing frames depending on which option you choose from the main menu.

Main menu

The Main menu runs across all areas within the dashboard and is divided into three units: the dashboard, content, and configuration.

The full Dashboard menu contains options: Dashboards, Home, and Updates.

The full Content menu offers options:  Posts, Media, Pages, and Comments.

  • Posts – serves to create, publish, and modify articles, categories, and tags of articles.
  • Media – is used to manage media files (images, documents, music files …) that you can add to Posts or Pages. The library contains a list of all the media files you use in your system.
  • Pages – pages are “static” parts. Most commonly used for content that is rarely changed, such as the contact page, about us etc. Pages can be linked to the menu.
  • Comments – it serves to comment management if you have allowed comments on your webpage. If you’ve set up to Approve a comment, you will also do this through this interface.

The Configuration menu contains options: Appearance, Plugins, Users, Tools, and Settings.

  • Appearance – used to manage the look of the website itself. Through this section, you can change themes, add widgets, edit menus, edit headers and editor item allows to edit your own page.
    • Themes – Themes are the visual part of your site. As mentioned earlier, there is a multitude of free themes that you can download from the Internet, and you can do this through this menu. Then download and activate the downloaded theme. The same thing is with the topics you bought. Within the system, you can have a lot of themes and burn them to your liking.
    • Customize – open frontend editor where we can customize our website, change almost everything.
    • Widgets – Widget is a small block that performs a specific function that is placed in the sidebar in WordPress. Some are part of the system (archives, calendar, categories, meta, latest comments, latest posts, tag clouds, links, search, RSS, pages …) and you can download them much more on the Internet. Drag the new widget to the desired sidebar from the left list by dragging it into the right part of the sidebars where you place them. Pulling in the opposite direction, you can remove them.
    • Menus – Menus are created automatically depending on the theme you are using. You can link items within a menu to pages and articles. WordPress supports multiple menus so you can have support for more than one navigational menu (e.g. header and footer menus) depending on a theme. Users can add posts, pages, and custom links to a menu using drag and drop functionality.
    • Header – is tools where we can customize header.
    • Editor – editor item allows you if you know the rules of writing HTML, CSS, and PHP to write the code yourself to edit your own page. You can edit theme and plugins.
  • Plugins – allow you to increase the functionality of WordPress itself. Through this menu, you can manage existing add-ons, add new ones, or once again if you know how to program using the editors to change certain properties. There are a lot of plugins you can download from the Internet, and you can even download them through the WordPress system itself. After installation, it is necessary to activate them, and most of them require adjustments. If you do not like it, you can simply deactivate it, but also completely delete it.
  • Users – delivers a list of registered users and allows you to add new or modify existing ones. Through this system, you can also assign roles to users.
  • Tools – brings tools that are useful for working inside and outside the system.
  • Settings – allow you to change your system settings.
    • General -through this section you can set the Name of your site, Tagline, date and time settings, allow everyone to join or not  (New User Default Role), change Site Language, Timezone etc..
    • Writing – here you can adjust Default Post Category, Default Post Format, etc…
    • Reading – allows you to adjust the display of content on the homepage. You can set up to display the latest articles on Home Page or open a static page, you can set the number of articles on the page and choose whether to appear in summary or full text. Also, you can discourage search engines from indexing this site.
    • Discussion – allows you to set up additional comment settings.
    • Media – allows you adjust image size, maximum dimensions in pixels to use when adding an image to the Media Library.
    • Permalinks – Using this menu you can set the look of the URL for your permanent links and archives (pages, articles …). WordPress is configured to automatically use web URLs (“web addresses”) that contain Day and name eg http://www.your-domain.com/tutorial/2018/03/06/sample -post /, but such an address is difficult to memorize and is not good for SEO. By using some of the other options available through this menu, you can improve the appearance, but also the usability and compatibility of the links themselves.

WordPress users can be assigned various roles (rights):

  • Admin – The main role. The owner of this role can do whatever he wants with the system. But for this reason, the administrator should only be one person who suits the site itself.
  • Editor – This person can write and post their articles but can open and edit existing articles for editing purposes, and this is also the sense of being a person’s editor. This person can, for example, rectify mistakes in texts or refresh them, etc.
  • Author – Is a person with these rights, can write an article and publish it. Since a person can publish an article without your permission, it is good that you really trust that person.
  • Contributor – Is a person who can write an article but can not publish it. You can confirm it (accept it) or reject it
  • Subscriber – If you have allowed anyone to register on your site, which is especially good if you plan to allow commentary, so it is good that registered users can comment on articles, then this is exactly the role. The person has no rights to change the content on the page itself.

Toolbar

The toolbar is located at the top of the administrator interface screen. Through links and simple commands, it helps to manage and navigate the page.

Toolbar

It changes depending on the position on the page and later on the page, depending on add-ons, topics, and possible program upgrades. However, basic toolbar components remain unchanged: WordPress logo, site name, comments, new and user profile icon.
By moving a mouse over the WordPress logo on the toolbar, a menu that provides links to the Welcome Program (WordPress) where we see which version we use, the official page (WordPress.org), the Documentation and Programming Information Page, Support Forums, and Feedback from the user.

Home icon leads to the publicly visible part of the page. Comments icon leads to the Comments page. Moving the mouse over + New opens a menu that offers the ability to navigate through the dashboard and through most of the functions on the page: Post, where we can add new post, Media, where we can add new media file, Page, where we can add new page and User, to ad new user.

At the right corner, there is a user icon (administrator) with a name, profile editing options, and a checkout command. The toolbar has a quick transition feature from the visible part of the page to the administrator section.

2. WordPress tutorial – Creating and publishing content

The difference between the post and the page

WordPress has two main types of content:

  • static pages
  • posts

Publishing both types of content is very easy, but it’s important to understand their differences in order to know when to use.

The key differences between posts and pages are:

  • Post contains current content and pages that have no “lifetime” content.
  • Post have categories, pages have a hierarchical structure.
  • Posts are convenient for sharing on social networks, pages are not.
  • Posts are included in RSS, pages are not.

Add new Page

Pages are used for static content, ie for those with no tendency for dynamic changes.

To create a new page just click “Pages” in the admin page interface and then clicking “Add new“.

page

This will bring you to an interface where you Enter the title, content, Add media files, Featured images, and other page elements. The content of the page can be edited using the built-in WordPress system tools that allow content editing similar to the one in Microsoft Word.

add-new-page

To try the page itself, if you do not want to use the actual text, you can use the Lorem ipsum text available at www.lipsum.com. This text has been used for centuries as a trial text in the printing industry, and the appearance of digital prints is also being used in the web environment. If you want to use some images on your page you can find a bunch of them for free on www.pixabay.com.

sample page

Add Media to Page or Post

To add some of the multimedia documents (especially images), place the cursor in the place where you want to set up the image, and in the toolbar, click the Add Media button. In the additional window, you can choose a file from Media Library, that’s already uploaded images, Upload Files from your PC. On the left side as you can see you can Create Gallery, Create Audio Playlist, Create Video Playlist, select Featured Image and Insert from URL, from another page.

how to add image in wordpress

On the right side, you can see details of a media file. For SEO, it would be good to enter the Title of image, and Alternative Text (Alt Text). The Caption is the text below the image itself. Add some Description. You can align the picture in a level with text (none), left (left), right (right) or center (center). When you click Link To, in a drop-down, you can change the link of the image, None – no link, Media File – is opening image itself, Attachment Page – open URL of a page where you put an image and  Custom URL to any URL that you enter. You can also choose the size of the image within the article. All of these settings can be changed later. When you are satisfied with the selected and configured click on the Insert into Page.

If you want to edit the image later, click on the picture a box will appear with icons, within which you can edit the alignment, one for editing, and the one to delete the image.

how to edit image in wordpress

 

Depending on the theme that is used, within the page properties that is located next to the page content editing box, it is possible to affect page layout by choosing among the templates offered: the original template, the home page template, or template without the sidebar.

page attributes in wordpress

This is our first page. The page is saved and posted by clicking on the “Publish” option, but we can see how it look on a website before publishing clicking on the “Preview“. It will be opened in a new tab of your browser. Also, we can click “Save Draft“. A page will not be published but saved as a Draft. You can continue editing or make changes on that page later and then Publish it. To edit pages saved as Draft just click “Pages” in the admin page interface, find that page, and click on a title. To make changes on the Published page move the mouse over the title you will see Edit and click it.

Add a new Post

Unlike pages that provide common information and static content, content on the page appears as articles, photos, or media records, and is organized chronologically, by author or thematic, and includes visitor comments and social network links. Creating and editing new posts in WordPress is done through a dashboard.

To add a new post, select the posts in the menu, then select Add new. The window will open in front of you as in the picture. Creating a new post starts by giving the title, which is important because of the later finding of the post. Also, WordPress automatically stores the contents of the posting during the creation, and in the event of computer, shut down content will not be lost.
Editing and placing content in the proposed box is facilitated by the number of commands located in the toolbars above the writing box.

add new post wordpress

In addition to the editing box and publishing space, as the basic parts of the publishing interface, there are still additional frames: Publish, Format, Categories, Tags, and the Feature image.

By selecting the Screen Options in the top right corner of the screen, there are additional elements that can be used when creating a post, such as additional fields, authoring, deploying display elements to one or two columns, or enabling a full length of text when writing.

Also, the content editing box has two options: visual and text. Visual editing shows the look of content that will be on the front, publicly available page. Text edit option contains encoded text with inserted content such as HTML and CSS.
After entering the editing text in the announcement box selects Save Draft and Preview. This opens a visible section of the page in a new window, allowing you to see the post as it will be displayed after the release. Additionally, content, such as the release date, author, comment link, and link to editing interface is added to the publication. Below the announcement, there is a link to the previous release and comment space. To resume publishing, the content editing box can be accessed via the Toolbar by selecting the Edit Post option.

Categories

The basic organizational tool in WordPress is the Category and Tag as an additional publishing grouping tool. Each publication should have at least one category for later retrieval on the page. It is also possible, given the organizational function, to associate multiple categories (and tags) with one publication. If the author does not assign the category of the announcement, the program indicates it in Default Post Category. To view the categorization of the posts, select the Post option in the main menu.

WordPress Categories

 

Adding a category is done by selecting a Category from the Post option in the main menu. Enter the category name (which will be displayed on the page by the post), and click Add New Category to add a new category. There are Parent Categories. Categories, unlike tags, can have a hierarchy. You might have Sport category, and under that have children categories for Soccer.
If you want to categorize non-categorized postings, you can quickly edit a drop-down in a post, and in the proposed category window, the desired categories are highlighted and the changes are updated.

The design of a category can also be done through the content editing box, at the same time as creating the content of a new Post.

add Categories from post

Click Add New Category to add a new category. Also, you can select Parent Category. You can select more categories, depending on content and select Primary category clicking Make primary.

How to add Links to pages and posts

Links with different content are an indispensable part of publishing on the web pages. In order to enter a link in the text of the publication, you need to know the exact URL (address) of the content with which the text in the announcement relates or directly copy the address from the web browser bar.

adding links wordpress

It is necessary to first mark a portion of the text in the publication to which the link is attached. The icon for entering and editing a link is selected in the toolbar (only active if the text in the post was previously marked). We can add a link here or we can go to Link options (gear wheel or right).

Link options WordPress

In URL field we can add a custom link, then enter a Link Text that is important as an information to the visitor to know where the link can redirect, select to Open link in a new tab if you want or select a link from existing content on our website. The link is simply removed by selecting a command to remove the link in the toolbar after tagging in the text of the post.

Media

By selecting Library option in the Media, a Media Library box opens, showing all media records that have been uploaded to the page. They can be listed or displayed as thumbnails, which is determined by selecting the icon in the collection screen toolbar.

Media-Library WordPress tutorial

The displayed content can be filtered by selecting the option from the drop-down menu All media items: by type of record in the publication, by date of upload or display of records not entered in the postings but are uploaded to the page (unpublished).
It is also possible to find specific content through the search engine. That’s why it is important to enter all data when uploading a media record.
In case you want to delete media or multiple media items at once, you first need to select media or the group option, then highlight the items and select the Delete Permanently from drop-down menu Bulk Action

By selecting a specific content from the Media Library, the attachment details box opens, showing full-size content with the editing option. On the right, you can see content information such as: Upload date, File URL, File name, File typeFile size and Dimensions of the media. Below the content information box, there are options to Delete Permanently and Update if you made any changes.

edit media wordpress tutorial

Bellow image is button Edit Image. Clickin on it we get to this page: Edit Media.

Here we can change image size, crop image, add Caption, Alternative Text, and DescriptionAlternative Text is must have for SEO. When you made changes just click Update.

I would not recommend adding videos or large PDF documents to Media Library due to the large traffic on your site. You prefer to create a YouTube channel and add videos, and there are plenty of free PDF upload sites, so just put a link to it on your Post or Page.

3. WordPress tutorial – Edit the layout of the website and content

Editing text

Editing text in WordPress is important for adapting to future readers as well as for later page content retrieval. Although there is a similarity with Microsoft Word, editing of the text should be done using the WordPress editing tool. You should have in mind that the final appearance of a publication depends on the theme and design of the page so it is recommended to focus on the basic text processing.

Toolbar for editing text

The edit toolbar can be displayed in one or two rows that are selected using the icon to show/hide the toolbar, also look of text editor depend on installed Plugins and Themes. There is the ability to write without interference, which extends the text box space without additional frames.
Options for writing styles are: bold, italic, underline, and overlapping. Text-view modes can be a numeric or non-numeric list, text alignment left, right or center and different text colors.
The function of the quotation section allows the separation of text in a later publication, and the link icons their insertion, editing or removal.
Titles and Subtitles (Headings) are edited after selecting a text and selecting an option in the drop-down menu.
Other tools are the pasting icon of the previously written text, entering special characters, move text left or right, and the undo or redo the previous action. Clicking on question mark you will get Keyboard Shortcuts, a helpful tool with a list of shortcut keys for all the options listed.

Manage menus

Menus are one of the key elements when viewing a website. They serve to facilitate the orientation and presentation of the content available on the website. If you want to add, delete, or edit the menu link, in WordPress, you can do so in just a few easy steps.
In the administrative page, you need to click on the “Menus” option located within the “Appearance” option. The system will then redirect you to the site edit interface of your website.

menus wordpress tutotial

The displayed interface consists of 3 logical units. In the top part of the interface, you can create new menus to use on the web page, but you can also select existing menus that you want to edit. All Pages, Posts, Products, Categories, and site Tags on the functional lists are on the left side of the site. Clicking on “Screen Options” on right top you can create a functional list. Finally, the structure of the selected menus and additional settings are on the right side of the interface.
New links in the menu can be added in 2 different ways. The first is to select an existing page element (page, post, category …) from the list in the left part of the interface and click on the “Add to menu” option. Another way is to type the name of the link under “Custom Links” and link it to the URL address you want it to target. In this way, links to other websites can be added to navigation.

The menu structure can be changed in a way that changes the order of links or their hierarchy. If you want to change the order of the links, you need to click the desired link and move it below or above its current position. If you want to change the link hierarchy, you need to click on the desired link and move it left or right in relation to its parent element.
By clicking the arrow in the menu item, you can access additional options of an element such as renaming, moving, and deleting.
All changes made to the navigation interface are confirmed by clicking on the “Save menu” option.

Customize the theme

The selected Theme can be customized before it is published. We can customize Theme by selecting the option Customize which located in Appearance option.
By selecting, the adjustment box opens on the left side of the front (public) part of the page, and the changes are immediately visible.

customize theme wordpress tutorial

Customization options depend on the selected theme. Selecting each option opens the relevant box and the desired changes to make.
Among the most common customization options are: web page name and slogan, background color selection, header image customization, background image setup, and static homepage selection. The background image is set to the command selects the image after which the media collection opens or a new one is uploaded.
If the theme allows you to set a static home page, you need to select a home page in the relevant menu and specify a publication page. After the adjustment has been made, click Publish, or the page exit without recording is confirmed.

4. WordPress Tutorial – Additional options and settings

WordPress settings

As you can edit a user profile, you can also customize WordPress settings. Selecting option Settings from the main menu displays items that can be changed.

General Settings

By selecting the option in General, the general settings screen is displayed.

general settings wordpress tutorial

You can edit the name of the web page and slogan. The email address must be the one that is associated with the WordPress user account page and the administrator’s login because all the information related to the changes on the page is sent to it. It is possible to setup membership of the page, a predefined role is set to subscriber. Further, it is possible to set the time zone, the date and time format, and the web page language. Changes are stored by selecting Save Changes.

Writing Settings

Selecting the Writing option opens the Writing Settings screen.

writinig setings

It is possible to setup Default Post Category and the Default Post Format. If you save post without selecting category and post format they are going to use those settings.

You can Post via emailPosts by email feature allow you to publish content even when you can’t access your website. This feature is also useful for journalists and activists working in troubled areas with little internet connectivity.

Update Services are tools you can use to let other people know you’ve updated your blog. WordPress automatically notifies popular Update Services that you’ve updated your blog by sending a XML-RPC ping each time you create or update a post. How to use Update Services read here.

Reading Settings

By selecting Reading we go to Reading Settings page.

reading settings

In the editing screen, you can change Yor homepage displays. To be a static page or to display the latest posts. We can also select Post page that will display your posts.

You can determine the number of Posts that will be displayed on the page and the number of items that will show syndicated channels, if the page subscribers use RSS formats, and the form of publication when using RSS, full text, or summary of the announcement. Furthermore, it suggests search engine visibility, it allows or does not allow indexing of a web page. Changes are stored with the Save Changes command.

Discussion

Discussion settings allow you to set up additional comment settings.

Discussion Settings

Here you can read more about Discussion settings:  A Guide to WordPress Discussion Settings

Permalink

For the sake of visibility and ease of use on the WordPress page, you can use the Permalink settings, i.e., the permanent URL structure to the individual content on the web page.

Permalink Settings

Site visitors will make it easier to search for specific content and to share content via email or social links. The Permalink Settings editing box opens by selecting a Permalink link in the Settings option on the main menu.
The usual settings are offered, such as: Day and name, Month and name, Numeric, Post name, and Custom structure. The default setting is Plain: the name of the page /? P = 123 ie according to the order of publication of the content. Generally, it is recommended to select a permanent connection setting by the Post name. The selection is confirmed by the Save Changes.

Related eBooks

Facebook Comments

You may also like...

Leave a Reply

avatar
  Subscribe  
Notify of