KEMBAR78
Web Design Course Material | PDF | Public Key Certificate | Domain Name
0% found this document useful (0 votes)
65 views59 pages

Web Design Course Material

Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
65 views59 pages

Web Design Course Material

Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 59

THE COMPUTER SYSTEM

A computer is a machine (mostly electronic) that is able to take information (input), and
process it to make new information (output).
PARTS OF A COMPUTER SYSTEM
1. Hardware
 Monitor
 Mouse
 Keyboard
 Joystick
 Image scanner
 Printer
 Webcam
 CPU
 Hard disk
2. Software
 Operating systems
 System drivers
 BIOS & UEFI
 Firmware
COMMON USE OF THE COMPUTER SYSTEM
 Word processing
 Spreadsheets (Excel)
 PowerPoint Presentations
 Photo Editing (Photoshop, GIMP)
 E-mail
 Video editing/rendering/encoding
 Audio recording
 System Management
WHAT IS WEB DESIGN
Design is the process of collecting ideas, and aesthetically arranging and implementing them,
guided by certain principles for a specific purpose. Web design is a similar process of creation,
with the intention of presenting the content on electronic web pages, which the end-users can
access through the internet with the help of a web browser.

ELEMENTS OF WEB DESIGN


Web design uses many of the same key visual elements as all types of design such as:
LAYOUT: This is the way the graphics, ads and text are arranged. In the web world, a key goal is
to help the view find the information they seek at a glance. This includes maintaining the
balance, consistency, and integrity of the design.
COLOUR: The choice of colours depends on the purpose and clientele; it could be simple black-
and-white to multi-coloured design, conveying the personality of a person or the brand of an
organization, using web-safe colours.
GRAPHICS: Graphics can include logos, photos, clipart or icons, all of which enhance the web
design. For user friendliness, these need to be placed appropriately, working with the colour
and content of the web page, while not making it too congested or slow to load.
FONTS: The use of various fonts can enhance a website design. Most web browsers can only
read a select number of fonts, known as "web-safe fonts", so your designer will generally work
within this widely accepted group.
CONTENT: Content and design can work together to enhance the message of the site through
visuals and text. Written text should always be relevant and useful, so as not to confuse the
reader and to give them what they want so they will remain on the site. Content should be
optimized for search engines and be of a suitable length, incorporating relevant keywords.
IMPORTANCE OF WEB DESIGN
The design of your website can either make or break the business you are trying to deliver. It
actually makes a difference on how your target audience views your business or company and
potentially turn them into your customers. As such, developing a website design that has an
impressive user interface will result in a much better conversion rate, which leads to better
business and revenue.
COMMON WEB DESIGN LANGUAGES
1. HTML
HTML makes up the layout and structure for your website. This language is dynamic and allows
you to create a beautiful website using less code. HTML is used to create a starting point for the
website and is what most of your static pages start from. A better way to understand this
language is to consider it as the skeleton that is holding your website together.
2. CSS
CSS is the language developers can use to style a website. The style sheet language describes
how your website is presented and its layout. CSS is used hand in hand with HTML to add
colors, backgrounds, layouts, font sizes, and more. This language is a core technology web
developers use to design and build websites.

3. JAVA
Java is one of the most popular programming languages. It is used to develop website content,
games, apps, and software. Java is used in the production of most Android apps. Studies have
shown over 15 billion devices are using Java in some form or other. Java language is portable
and can be run on multiple software platforms.
4. JAVASCRIPT
JavaScript is used in many aspects of web development. Web developers use this language to
add interactive elements to their websites. User engagement is important to your business, and
your web developer should be incorporating JavaScript elements in your design.
5. PYTHON
Python is one of the easiest languages to use and work with. Python can create a framework for
basically any website need. This language uses simple and straightforward syntax, making it
easy for web developers to work with and explain to their users. Some familiar sites that are
using this language are Pinterest and Instagram.
6. SQL
SQL is a database query language that is used when your website is computing large amounts of
data. Using SQL allows you to gather data from different databases and use it to cater your
website to your target audience. This language is not used alone; instead, it is paired with
others to get the most out of your customer database and website development.
7. PHP
PHP is often used on data-heavy websites or for app development. This is an open-source
language that can be easily modified to meet the needs of your business or website. Large
websites like WordPress and Facebook use PHP to manage and process their data.
TYPES OF WEB DESIGNS PLATFORMS
1. Wix
2. Weebly
3. Webnode
4. Jimdo
5. Sprout Builder
6. Viviti
7. Synthasite
8. Wordpress
9. Joomla
10. Drupal
11. Magento
12. Squarespace
CMS (CONTENT MANAGEMENT SYSTEMS)
A content management system (CMS) is a software application or set of related programs that
are used to create and manage digital content. CMSes are typically used for enterprise content
management (ECM) and web content management (WCM). An ECM facilitates collaboration in
the workplace by integrating document management, digital asset management and records
retention functionalities, and providing end users with role-based access to the organization's
digital assets. A WCM facilitates collaborative authoring for websites. ECM software often
includes a WCM publishing functionality, but ECM webpages typically remain behind the
organization's firewall.
TYPES OF CMS
1. WordPress
2. Drupal
3. Joomla
4. Expression Engine
5. Text Pattern
6. Radiant
7. Cushy
8. Alfresco
9. SilverStripe
10. Kentico
USES OF THIS CMS
 Personal websites
 Business websites
 Ecommerce websites
ECOMMERCE PLATFORMS
 WordPress
 Shopify
 OpenCart
 Magento
 BigCommerce
 3dCart
 SquareSpace
 Prestashop
 Kibo
WEB HOSTING & DOMAIN
Web hosting is a service that allows organizations and individuals to post a website or web page
onto the Internet. A web host, or web hosting service provider, is a business that provides the
technologies and services needed for the website or webpage to be viewed in the Internet.
Websites are hosted, or stored, on special computers called servers. When Internet users want
to view your website, all they need to do is type your website address or domain into their
browser. Their computer will then connect to your server and your webpages will be delivered
to them through the browser.
features you should be expecting from your hosting provider:
Email Accounts: As mentioned earlier, most hosting providers require users to have their own
domain name. With a domain name (e.g. www.yourwebsite.com) and email account features
provided by your hosting company, you can create domain email accounts (e.g.
yourname@yourwebsite.com).
FTP Access: The use of FTP lets you upload files from your local computer to your web server. If
you build your website using your own HTML files, you can transfer the files from your
computer to the web server through FTP, allowing your website to be accessed through the
internet.
WordPress Support: WordPress is an online website creation tool. It is a powerful blogging and
website content management system, which is a convenient way to create and manage
website. WordPress powers over 25% of websites on the internet. Most hosting providers will
tell you right away if their plans are WordPress-compatible or not. The simple requirements for
hosting your WordPress websites include: PHP version 7 or greater; MySQL version 5.6 or
greater.
TYPES OF WEB HOSTING
1. Shared Hosting
Shared hosting means just that. Your website is hosted on a server shared by other websites.
The advantage of this setup is the shared cost. You can pay a little fee per month for sharing a
super server with (probably) hundreds (or thousands) of other websites.
The biggest disadvantage of a shared hosting account is that you're at the mercy of the other
sites on your server. A really popular site may adversely affect the performance of your own
site. On the other hand, if you're the most popular site on the server, you get to use a super
server for a very low price.
2. Reseller Hosting
Reseller hosting packages are basically a shared hosting account with extra tools to help you
resell hosting space.
Reseller packages come with greater technical control (often via the Web Host Manager (WHM)
control panel), billing software to help you invoice clients and other extra perks.
Some of those perks include:
 free website templates
 white label technical support -- that means the hosting company handles your clients'
tech support issues
 private name servers -- make your company seem even bigger by telling your clients to
point their domain name servers to ns1.yourwebdesignfirm.com

3. Cloud Based Hosting


Cloud Based Web Hosting refers to a fairly new hosting technology that lets hundreds of
individual servers work together so that it looks like one giant server. The idea is that as the
need grows, the hosting company can just add more commodity hardware to make an ever
larger grid or cloud.
The advantage of cloud-based web hosting is that if you get an unusually large amount of
website traffic the web hosting plan can accommodate the surge of traffic - rather than shutting
your website down.
4. Dedicated Hosting
When you have a dedicated server, it means you are renting one physical server from a hosting
company. You can have full control (called "root" permissions in Linux) if you want it.
With a dedicated server, you don't have to worry about other websites on a shared server
taking up your resources and slowing your website down.
A dedicated server is generally the highest level of server you would need if your online
business grows into a presence that is getting a lot of website traffic. While the costs of a
dedicated server are significantly higher than shared hosting, your business will be at a point
that can easily afford the necessary costs of having your own server.
5. VPS (Virtual Private Server)
Virtual private servers share one physical server but acts like multiple, separate servers. A VPS is
a stepping stone between shared hosting and getting your own dedicated machine. Even
though each VPS instance shares hardware resources, they are allocated a dedicated slice of
the computing resources.
6. Colocation Hosting
When you colocate, you rent rack space from a data center. You bring in your own server
hardware and they provide power, cooling, physical security, and an internet uplink. This means
you're responsible for your own server software, data storage, backup procedures, etc. If
hardware fails, you're responsible for replacing it and getting the server back up and running.
Unless you have the technical know-how in-house, colocation is probably not worth the
investment in time, expertise, and money for small businesses.

7. Self Service Hosting


The ultimate hosting plan -- you do it all yourself! You buy the servers, install and configure the
software, make sure there is sufficient cooling and power in your machine room, and double up
everything for redundancy. Some of the things you'll have to take care of:
 data center space
 cooling
 power (with backup)
 bandwidth
 server hardware
 systems administrator
 data integrity and backup etc.
Similar to colocation web hosting, this most likely beyond the scope of what you'd want to do
as an online business owner.
8. Managed WordPress Hosting
Managed WordPress hosting is a service where the web hosting provider will keep your
WordPress installation up-to-date which can help protect your site from security threats that
would allow hackers into your website.
While not the as inexpensive as shared web hosting, this is a great option for both startup
businesses and established businesses that use the WordPress platform.
WHAT IS A DOMAIN, SUB-DOMAIN & DOMAIN NAME?
A domain, in the context of networking, refers to any group of users, workstations, devices,
printers, computers and database servers that share different types of data via network
resources. There are also many types of subdomains.
A domain has a domain controller that governs all basic domain functions and manages
network security. Thus, a domain is used to manage all user functions, including
username/password and shared system resource authentication and access. A domain is also
used to assign specific resource privileges, such as user accounts.
A subdomain is a domain that is a part of a larger domain under the Domain Name System
(DNS) hierarchy. It is used as an easy way to create a more memorable Web address for specific
or unique content with a website. For example, it could make it easier for users to remember
and navigate to the picture gallery of a site by placing it in the address gallery.mysite.com, as
opposed to mysite.com/media/gallery. In this case, the subdomain is gallery.mysite, whereas
the main domain is mysite.com. A subdomain is also known as a child domain.
A domain name is your website name. A domain name is the address where Internet users can
access your website. A domain name is used for finding and identifying computers on the
Internet. Computers use IP addresses, which are a series of number.

TYPES OF DOMAINS
TLD - Top Level Domains
 ccTLD - country code Top Level Domains e.g. .au, .en, .ng
 gTLD - generic Top Level Domain: The best known generic TLD's
include .com, .net, .biz, .org and .info - these can be registered by anyone, anywhere in
the world.
 IDN ccTLD - internationalised country code top-level domains: A top-level name with a
specially encoded format that allows it to be displayed in a non-Latin character set (i.e.
special characters).
PLUGINS & SECURITY
(SEO) Search Engine Optimization
Search engine optimization (SEO) is the practice of increasing the quantity and quality of traffic
to your website through organic search engine results.
SSL Certificate
SSL Certificates are small data files that digitally bind a cryptographic key to an organization’s
details. When installed on a web server, it activates the padlock and the https protocol and
allows secure connections from a web server to a browser. Typically, SSL is used to secure
credit card transactions, data transfer and logins, and more recently is becoming the norm
when securing browsing of social media sites.
SSL Certificates bind together:
 A domain name, server name or hostname.
 An organizational identity (i.e. company name) and location.
SSL certificates are issued to websites by a trusted third party known as a 'Certificate Authority'
(CA) and are available in a variety of types and validation levels:
Certificate Validation Levels
Extended Validation Certificates:
EV certificates provide the highest levels of security, trust and customer conversion for online
businesses. EV certificates are issued only after the issuing CA has conducted rigorous
background checks on the company according to the guidelines laid out by the Certificate
Authority/Browser (CA/B) Forum. Because of this, EV certificates contain a unique differentiator
designed to clearly communicate the trustworthiness of the website to its visitors. Whenever
somebody visits a website that uses an EV certificate, the address bar will turn green in major
browsers such as Internet Explorer, Firefox and Chrome. EV certificates are used by all major
online retailers and banks and are highly recommended for businesses that wish to
immediately build customer trust in their site.
Examples: Comodo EV SSL Certificate, Comodo EV Multi-Domain Certificate
Organization Validated Certificates:
OV certificates include full business and company validation from a certificate authority using
their established and accepted manual vetting processes. Each OV certificate contains full
company name and address details, which means they provide significantly higher levels of
assurance to end-users than Domain Validated certificates. However, because they are not
validated to the CA/B forum standards, they do not possess the ability to turn the browser
address bar green.
Examples: Instant SSL, Premium SSL Wildcard, Comodo Multi-Domain Certificate
Domain Validated Certificates:
DV certificates provide the same high levels of data encryption as the other validation levels but
do not provide assurance about the identity of the business behind the website. Whereas EV
and OV certificates are only issued after the applicant organization has been manually vetted by
a certificate authority, DV certs are issued after domain control has been established using an
automated, online process. DV certs are a popular choice amongst small-medium sized web
sites because of their faster issuance times and lower price points.
Example: Essential SSL
Certificate Types
Single Domain Certificates:
A single domain certificate allows a customer to secure one Fully Qualified Domain Name on a
single certificate. For example, a certificate purchased for www.domain.com will allow
customers to secure any and all pages on www.domain.com/. Single domain certificates are
available in DV, OV and EV variants at a variety of price points and warranty levels. The
straightforward nature of the single domain certificate makes it ideal for small to medium sized
businesses managing a limited number of websites. However, businesses that operate or
anticipate operating multiple websites may benefit from the added flexibility, convenience and
savings offered by wildcard or multi-domain certificates.
Examples: Instant SSL, Instant SSL Pro, Instant SSL Premium
Wildcard SSL Certificate:
A Wildcard certificates allows businesses to secure a single domain and unlimited sub-domains
of that domain. For example, a wildcard certificate for '*.domain.com' could also be used to
secure 'payments.domain.com', 'login.domain.com, 'anything-else.domain.com' etc. A wildcard
certificate will automatically secure any sub-domains that a business adds in the future. They
also help simplify management processes by reducing the number of certificates that need to
be tracked. For growing online businesses, Wildcard certificates provide a flexible, cost effective
alternative to multiple single certificate purchases
Example: Comodo Premium SSL Wildcard

Multi Domain SSL Certificate (MDC):


As the name suggests, a Multi-Domain certificate allows website owners to secure multiple,
distinct domains on a one certificate. For example, a single MDC can be used to secure domain-
1.com, domain-2.com, domain-3.co.uk, domain-4.net and so on. Indeed, an MDC will allow you
to secure up to 100 different domains (or wildcard domains) on a single certificate. Customers
can easily add or remove domains at any time. This simplifies SSL management because
administrators need only keep track of a single certificate with a unified expiry date for all
domains instead of keeping tabs on multiple certificates. In addition, MDCs usually represent a
cost saving over the price of individual certificates.
Example: Comodo Multi-Domain Certificate, Comodo EV Multi-Domain Certificate
Unified Communications Certificate (UCC):
Unified Communications Certificates are specifically designed to secure Microsoft® Exchange
and Office Communications environments. UC certificates use the Subject Alternative Name
(SAN) field to allow customers to include up to 100 domains on a single certificate - eliminating
the need for different IP addresses per website that would be required otherwise. UC
Certificates also support the Microsoft Exchange Auto discover service, a powerful feature
which greatly eases client administration. As with MDCs, a single UCC can greatly reduce SSL
management duties while allowing customers to realize cost savings over individual purchases.
Examples: Comodo Unified Communications Certificates
SiteLock
SiteLock is a cloud-based security tool that scans your website for malware and vulnerabilities.
SiteLock not only detects threats, but can also fix problems or security risks it encounters on
your web space. SiteLock automatically scans your website for malware to ensure they are not
being blocked or spammed.
Cloudflare
An online security system, it is a cloud-based security tool also like the sitelock
Payment Gateway
A payment gateway is a merchant service provided by an e-commerce application service
provider that authorizes credit card or direct payments processing for e-businesses, online
retailers. The payment gateway may be provided by a bank to its customers, but can be
provided by a specialized financial service provider as a separate service, such as a payment
service provider.
Kinds of Payment Gateways:
Local
 Paystacks
 Webpay
 Interswitch
 Quickteller

Foreign
 Stripe
 Amazon
 Adyen
 Paypal
 Skrill
LiveChat
LiveChat is an offline customer service software with live support, help desk software, and web
analytics capabilities.
GETTING TO KNOW WORDPRESS
WordPress is a free and open-source content management system (CMS) based on PHP and
MySQL. Features include a plugin architecture and a template system. It is most associated with
blogging, but supports other types of web content including more traditional mailing lists and
forums, media galleries, and online stores.
WordPress.com vs WordPress.org – What’s the Difference?
WordPress.com is not the same as the software and it isn’t even the owner. Instead, the
platform is a hosting service.
WordPress.org, on the other hand, is the home of that software. The site is managed by the
non-profit WordPress Foundation.
Installing and running WordPress
WordPress can be installed either locally after downloading the zip file from wordpress.org and
upload into the host server or from the host server cpanel by simply logging into your hosting
account and then on your cpanel dashboard and one-click install of wordpress.
WordPress Dashboard
The Dashboard (wp-admin) is the first screen you see when you log into the administration area
of your blog.
The Dashboard contains the following modules:

Dashboard Menu
The WordPress Dashboard provides navigation menu that contains some menu options such as
posts, media library, pages, comments, appearance options, plugins, users, tools and settings
on the left side.
Screen Options
The dashboard contains different types of widgets which can be shown or hidden on some
screens. It contains check boxes to show or hide screen options and also allows us to customize
sections on the admin screen.
Welcome
It includes the Customize Your Site button which allows customizing your WordPress theme.
The center column provides some of the useful links such as creating a blog post, creating a
page and view the front end of your website. Last column contains links to widgets, menus,
settings related to comments and also a link to the First Steps with WordPress page in the
WordPress codex.
Quick Draft
The Quick Draft is a mini post editor which allows writing, saving and publishing a post from
admin dashboard. It includes the title for the draft, some notes about the draft and save it as a
Draft.
Quick Draft is a mini-post editor that allows instant content creation from the Dashboard. You
can include a title and body text in the post, and save it as a Draft. For additional options such
as adding categories or setting a future publish date, you should use the Add New Post screen.
Below displays links to your most recent drafts, allowing one-click access from the Dashboard. If
you click on any one of them, you will be taken directly to edit that post.
WordPress News
The WordPress News widget displays the latest news such as latest software version, updates,
alerts, news regarding the software etc. from the official WordPress blog.
Activity
The Activity widget includes latest comments on your blog, recent posts and recently published
posts. It allows you to approve, disapprove, reply, edit, or delete a comment. It also allows you
to move a comment to spam.
At a Glance
This section gives an overview of your blog's posts, number of published posts and pages, and
number of comments. When you click on these links, you will be taken to the respective screen.
It displays the current version of running WordPress along with the currently running theme on
the site.

Stats
The Stats module is a favorite of many users. It’ll show you a graph of your blog’s traffic as well
as links to some popular areas of your blog. The graph works just like the graphs on the Site
Stats screens, so you can click a point to see more information about that day’s traffic.
CREATING POSTS
Understanding posts
A post is a content item stored in the wp_posts table. Each has a post type assigned to it, which
could be post, page or something else.
Post is a post type, used for blog posts or news items depending on the type of site you're
developing.
WordPress comes with five post types built in:
 Post
 Page
 Attachment
 Revision
 Navigation Menu Item
Understanding the Default Post Types
Let's have a quick look at each of the built-in post types, how they're similar to each other and
how they differ. Note that in the table below, I use the term post in the generic sense to
describe content of all post types.
Post Type Used For Notes
Post Blog posts or Core post type - listed on main blog page
similar
Page Static pages Designed to be displayed singly - not generally
used in archives (although they can be). Pages can
have parents, which are defined using the
post_parent field in the record for the child page.
Each page can have multiple children but only one
parent.
Attachment Documents and Media uploaded to a post will have the ID of that
images (which post in its post_parent field. Images uploaded via
may or may not the Media screen in the dashboard will have that
be attached to a field blank. The guide field is used to store the url
post) of the media file.
Revision Individual Each revision is attached to a post: the ID of that
revisions to each post will be stored in the revision's post_parent
post field.
Navigation Menu Individual Each menu will contain a number of navigation
Items navigation menu items, each of which is stored as a post. The
items menu_order field is used to store information
about the order of navigation menu items, and
additional data such as the target and parent
menu item are stored as records in the
wp_postmeta table.

DESCRIPTIONS OF POST FIELDS


Title/Headline Box
The title of your post. You can use any phrases, words or characters. Avoid using the same title
twice as that will cause problems. You can use commas, apostrophes, quotes, hyphens/dashes
and other typical symbols in the post like "My Site
Body Copy Box
The blank box where you enter your writing, links, links to images, and any information you
want to display on your site. You can use either the Visual or the Text view to compose your
posts. For more on the Text view, see the section below, Visual Versus Text View.
Preview button
Allows you to view the post before officially publishing it.
Publish box
Contains buttons that control the state of your post. The main states are Published, Pending
Review and Draft. A Published status means the post has been published live on your blog for
all to see. Pending Review means the draft is waiting for review by an editor prior to
publication. Draft means the post has not been published and remains a draft for you. If you
select a specific publish status and click the update post or "Publish" button, that status is
applied to the post. For example, to save a post in the Pending Review status, select Pending
Review from the Publish Status drop-down box, and click Save As Pending. (You will see all
posts organized by status by going to Administration Panels > Posts > Edit). To schedule a post
for publication on a future time or date, click "Edit" in the Publish area next to the words
"Publish immediately". You can also change the publish date to a date in the past to back-date
posts. Change the settings to the desired time and date. You must also hit the "Publish" button
when you have completed the post to publish at the desired time and date.
Publish box
Visibility - This determines how your post appears to the world. Public posts will be visible by all
website visitors once published. Password Protected posts are published to all, but visitors must
know the password to view the post content. Private posts are visible only to you (and to other
editors or admins within your site)
Permalink
Permalink stands for "permanent link". That means a post URL that does not expose the post ID
which could be subject to a change (e.g. when moving to different blogging system), but it
rather contains a user-friendly post name derived from the post title which could also change,
although not recommended, but in a more controllable way. This post name (also referred to as
"post slug" or just "slug") can be edited, depending on your Permalinks settings, using the "Edit"
button. (To change your settings, go to Administration Panels > Settings > Permalinks). The
permalink is automatically generated based on the title you set to the post and is shown below
the title field. Punctuation such as commas, quotes, apostrophes, and invalid URL characters
are removed and spaces are substituted with dashes to separate each word. If your title is "My
Site - Here's Lookin' at You, Kid", it will be cleaned up to create the slug "my-site-heres-lookin-
at-you-kid". You can manually change this, maybe shortening it to "my-site-lookin-at-you-kid".
Publish
Publishes your post on the site. You can edit the time when the post is published by clicking the
Edit link above the "Publish" button and specifying the time you want the post to be published.
By default, at the time the post is first auto-saved, that will be the date and time of the post
within the database.
Post Tags
Refers to micro-categories for your blog, similar to including index entries for a page. Posts with
similar tags are linked together when a user clicks one of the tags. Tags have to be enabled with
the right code in your theme for them to appear in your post. Add new tags to the post by
typing the tag into the box and clicking "Add".
Categories
The general topic the post can be classified in. Generally, bloggers have 7-10 categories for their
content. Readers can browse specific categories to see all posts in the category. To add a new
category, click the "+Add New Category" link in this section. You can manage your categories by
going to Administration Panels > Posts > Categories.
Excerpt
A summary or brief teaser of your post featured on the front page of your site as well as on the
category, archives, and search non-single post pages. Note that the Excerpt does not usually
appear by default. It only appears in your post if you have modified the template file listing the
post to use the_excerpt() instead of the_content() to display the Excerpt instead of the full
content of a post. If so, WordPress will automatically use as the Excerpt the first 55 words of
your post content or the content before the <!--more--> quicktag. If you use the "Excerpt" field
when editing the post, this will be used no matter what. For more information, see Excerpt.
Custom Fields
Custom_Fields offer a way to add information to your site. In conjunction with extra code in
your template files or plugins, Custom Fields can modify the way a post is displayed. These are
primarily used by plugins, but you can manually edit that information in this section.
Discussion
Options to enable interactivity and notification of your posts. This section hosts two check
boxes: Allow Comments on this post and Allow trackbacks and pingbacks on this post. If
Allowing Comments is unchecked, no one can post comments to this particular post. If Allowing
Pings is unchecked, no one can post pingbacks or trackbacks to this particular post.
Password Protect This Post
To password protect a post, click Edit next to Visibility in the Publish area to the top right, then
click Password Protected, click Ok, and enter a password. Then click OK. Note - Editor and
Admin users can see password protected or private posts in the edit view without knowing the
password.
Post Author
A list of all blog authors you can select from to attribute as the post author. This section only
shows if you have multiple users with authoring rights in your blog. To view your list of users,
see Users tab on the far right. For more information, see Users and Authors.
Visual Versus Text Editor
When writing your post, you have the option of using the Visual or Text mode of the editor. The
visual mode lets you see your post as is, while the Text mode shows you the code and replaces
the WYSIWYG editor buttons with quicktags. These quicktags are explained as follows.
b - <strong></strong> HTML tag for strong emphasis of text (i.e. bold).
i - <em></em> HTML tag for emphasis of text (i.e. italicize).
b-quote - <blockquote></blockquote> HTML tag to distinguish quoted or cited text.
del - <del></del> HTML tag to label text considered deleted from a post. Most browsers display
as striked through text.
link - <a href="http://example.com"></a> HTML tag to create a hyperlink.
ins - <ins></ins> HTML tag to label text considered inserted into a post. Most browsers display
as underlined text.
ul - <ul></ul> HTML tag will insert an unordered list, or wrap the selected text in same. An
unordered list will typically be a bulleted list of items.
ol - <ol></ol> HTML tag will insert a numbered list, or wrap the selected text in same. Each item
in an ordered list is typically numbered.
li - <li></li> HTML tag will insert or make the selected text a list item. Used in conjunction with
the ul or ol tag.
code - <code></code> HTML tag for preformatted styling of text. Generally, sets text in a
monospaced font, such as Courier.
more - <!--more--> WordPress tag that breaks a post into "teaser" and content sections. Type a
few paragraphs, insert this tag, then compose the rest of your post. On your blog's home page,
you'll see only those first paragraphs with a hyperlink ((more...)), which when followed displays
the rest of the post's content.
page - <!--nextpage--> WordPress tag similar to the more tag, except it can be used any number
of times in a post, and each insert will "break" and paginate the post at that location. Hyperlinks
to the paginated sections of the post are then generated in combination with the
wp_link_pages() or link_pages() template tag.
lookup - Opens a JavaScript dialogue box that prompts for a word to search for through the
online dictionary at answers.com. You can use this to check spelling on individual words.
Close Tags - Closes any open HTML tags left open--but pay attention to the closing tags.
WordPress is not a mind reader (!), so make sure the tags enclose what you want, and in the
proper way.
CREATING PAGES
pages are generally for non-chronological, hierarchical content: pages like "About" or "Contact"
would be common examples. See below for examples of subpages in a hierarchy. Pages live
outside of the normal blog chronology, and are often used to present timeless information
about yourself or your site -- information that is always relevant. You can use Pages to organize
and manage the structure of your website content.
Creating a Hierarchy
Create a new page called My Posts, and add some text. And this time, go to the Parent drop-
down menu in the Page Attributes section on the right-hand side, and select About Me. Then
click Publish.
By selecting a parent, we've created a page which is underneath "About Me" in the page
hierarchy. If you view the page, you'll see that the URL slug is /about-me/my-posts/. So it shows
that it's in a hierarchy within your site. And if your theme includes breadcrumbs or you have a
breadcrumb plugin installed and activated, that would show up in the breadcrumbs.
Now let's create another page that will also live in that hierarchy. You can call it My Hobbies,
add some dummy text, choose About Me as the Parent, and click Publish.
Then, when you go to the screen that lists all your pages, you can see that hierarchy shown with
the dash next to the page names, so you can clearly see the structure of your site.
ADDING IMAGES & MEDIA
WordPress Media Library is a virtual repository of all media files (images, videos, audio, and
other documents) that you can use on your site. It allows you to upload and manage media
files, insert them into posts and pages, and even quickly edit on the go. Although you can work
with different file types, we will focus on images.
When you open the library for the first time, there won’t be any files on the list. So your first
task is to upload images so that you can use them in posts and pages. Please take note that you
can also add images and other files directly from the article you’re editing. Please see the next
section for more details about that.
To upload new images directly to WordPress Media Library, please follow these steps:
1. Navigate to Media -> Add New
2. Click “Select Files” button or drag&drop images to the window
3. If you clicked the button, select images and other media files from your computer

From the moment you opened images from your computer or dragged them to the dashed box,
WordPress will start uploading the files. Depending on the speed of your internet connection,
your hosting provider and the size of files, it may take you up to a few minutes on average until
WordPress finishes the upload process. Every file will get its personal progress bar so you can
know how fast (or slow) that particular file is uploading.
By default, WordPress allows you to upload multiple media files at once. Just in case this
doesn’t work for you, you can always switch back to a simpler Browser Uploader. It will work
even on older computers, but it will allow you to upload only one media file at the time.
Media Library

After uploading at least one file, the changes will be visible in the WordPress Media Library. To
open it, please navigate to Media -> Library.
This new page will show you a list of all media files that you’ve uploaded to WordPress. You can
show files in a list or grid view. If you want to filter specific file types, choose only images,
videos, audio or unattached files (files that don’t belong to any post or page). You can also
display images from specific months and years. If you want to delete more than just one image,
click the “Bulk select” button, choose images, and click the “Delete Selected” button.
On the right side of Media Library, you will find a simple search box which allows you to find an
image in the library. Although it may seem unnecessary at the moment, this feature will be very
helpful once you accumulate hundreds and thousands of files in the library.
Upload and insert images directly to your post
As you will probably spend the most of your time writing new posts, it is good to know that you
can add images and other media files directly from the post editing screen. By controlling media
files from here, you even get a few extra options, so let’s see them.
By clicking the “Add Media” button on top of the post edit screen, a new pop-up window will
appear. Basically, the WordPress Media Library is the same – you can upload files directly from
your computer or select images already uploaded to the library.
1. Place the cursor where you want the image to appear in the article
2. Click the “Add Media” button on top of the screen
3. Upload or select a picture from the Media Library tab
4. Edit the image and its details if necessary
5. Click on “Insert into post” button
Although the screen looks pretty much the same as the one you open through WordPress
admin menu, you can notice that the left side has a few extra links. Besides inserting images,
you can create a gallery, select a featured image for that post or insert an image from URL.
Create a gallery

By setting up a gallery, you can select multiple images and add them into your post. WordPress
will then create a collage of the chosen images and display them within the post. If you are
using the visual editor, you will see all the grouped images, and you can click on them. If you do
so, two new icons will appear which will allow you to edit and remove the gallery.
If you switch to the Text editor, you will notice a [gallery] shortcode in the same place. As from
WordPress version 3.5, the gallery shortcode can be extended with numerous parameters so
you can modify it manually. Since working with the parameters requires some understanding of
how shortcodes work, we will skip that for now. But if you want to know more about the
feature, please see more about it on the official WordPress Codex pages.
Featured image
A featured image represents the contents, mood, or theme of a post or page. Posts and pages
can have a single featured image, which many themes and tools can use to enhance the
presentation of your site.
Select an image that will represent your post. Depending on the theme you are currently using,
this picture may appear in different places as your post’s thumbnail. It also frequently appears
above the post on the single-post page. But, again, it really heavily depends on the theme.
Insert from URL
If you have a picture located on another server and you can’t or don’t want to upload it to your
WordPress site, you can insert one from URL. You will need the absolute path (the complete
link address) to that image. For
example https://firstsiteguide.com/wp-content/uploads/2017/05/wordpress-media-library.jpg.
As soon as you paste the URL, there will be a preview of the image. You can also edit a few
details before inserting it into the post.
Before adding images from an URL, make sure that you have permission to do so. Many
photos are copyright protected, and using them without permission will mean that you’re
stealing those image.
Different image sizes
When you try to add images to a post or page, you will notice that WordPress lets you choose
its dimensions. By default, WordPress creates three additional sizes next to the original one. So,
even if you upload an HD image, for example, WordPress will automatically make it available in
these three resolutions if you are using the Twenty Seventeen theme:
 Thumbnail – 150×150 pixels
 Medium – 300×188 pixels
 Large – 525×328
Please note that this size may depend on the theme that you use. Also, you can select your own
dimension if you navigate to Settings -> Media from the WordPress dashboard menu.
How to edit image details

Before we get to the part where you can crop, resize and edit images, let’s see how to modify
some details. This will help you organize files on your site, and it will be beneficial to your visitor
and search engines to have all the extra data about files on your site.
1. Select any image from the library
2. A popup window will appear and show you the details about that image
3. On the right side, you will find information like image name, file type, upload date, file
size and dimensions
4. Below that you can see the URL of your picture
5. To edit the image, change its title, caption, alt text (shown to those users who can’t
open the photo), and description
6. Just below the description field, you can see which user uploaded this particular media
file
7. To edit more details, click the “Edit more details” link at the bottom
How to edit an image

WordPress developers were kind enough to introduce a feature that lets you modify images
that are already uploaded to WordPress Media Library. To do some extra work on the picture,
just select one from the Media Library list and click the “Edit Image” button below it.
Now you can crop, rotate and flip the image without having to upload it once again. There are
also undo and redo buttons that will let you fix mistakes done while editing. This tool is
obviously not a replacement for Photoshop but it does wonders for small, fast fixes.
Rotate
To rotate the image, you selected, click the button to turn it to left or right.
Scale
On the right side, you can enter new dimensions for your image. As you enter width or height,
WordPress will automatically calculate the other dimension so that your image keeps its aspect
ratio (you don’t want it to be distorted). If you try to scale up an image, you will see a little red
exclamation mark next to which will indicate that scaling up isn’t possible.
You can only scale down images in WordPress
Crop
To crop the image, click on it and drag to make your selection. By holding down the Shift key
while making a selection, you can keep the aspect ratio. If you want to modify it, change the
aspect ratio from the right side of the screen. For example, use 1:1 ratio to make a square
selection or change it to 4:3, 16:9 or anything else that you want. Once you have made your
selection, you can quickly adjust it by choosing the size in pixels. The minimum range size is the
thumbnail size as set in the Media settings.
Apply changes
The last option allows you to apply changes to all images sizes, just the thumbnail or everything
but the thumbnail. For example, you can have a square thumbnail that displays just a section of
the original image.
Attachment pages

From the moment you upload a new file, WordPress creates a new attachment page for it. You
can access this page by opening any image and clicking “View attachment page” from the right
side options panel.
MANAGING CONTENTS
Post Types
A post is a post is a post, right? Not quite. Technically, pretty much everything in the WordPress
database is a post. Then posts are categorized as types of posts. For example, a WordPress Page
is really a WordPress post assigned the post type of “page”. Additional built-in post types
include menus, media attachments, and, yes, posts. So posts assigned the type of post are “blog
posts” as we know them.
Additionally, custom post types (CPTs) can be created. So there’s essentially an unlimited
number of types of posts. Sometimes a slider plugin will create its own post type. A directory or
classifieds plugin will most likely create its own post type. Some themes include their own
custom post types.
Pages
WordPress Pages (posts of the “page” post type) are best for static content, like About Us,
Contact, and Pricing pages. “Static” doesn’t mean it can never change. Instead, static content is
content that is “less time-dependent than Posts” (per the Codex).
Pages are organized in a hierarchical fashion. That is, they can have child pages.
Pages can also be used to present a “best of” collection of posts (i.e. blog posts), which go
nicely when used with another benefit of Pages over Posts: Page Templates.
You can think of pages, child pages, and collections of posts as manual or automatic Tables of
Contents. It’s all up to you.
My favorite plugin for quickly displaying many pages/posts within a single page is Page-list.
However, I recently found Super Post, which seems like a full-featured alternative.
Posts
WordPress Posts (posts of the “post” post type) are what WordPress was originally created for
— blogging.
A site’s posts make up its blog. What you’re reading right now is a WordPress post, not a page.
It’s written as of the date published and may decrease in value over time, since it’s typically
time-dependent. Said better, it’s time-relevant or time-sensitive. For example, WordPress may
add an additional default post type a year from now and then this post would be slightly
inaccurate/outdated for not mentioning it. Well, since this post is published in early 2013, its
content is (supposed to be) understood that it was accurate as of that time period and possibly
less accurate as time goes on.

If you’re like me and wish your content never went out of style and magically stayed updated,
you’ll just have to keep wishing. However, maybe if you think of things this way, you won’t feel
so bad for posting and not updating: Think of posts as newspaper articles.
Another way to think about posts is as your publicly-accessible journal. Share your thoughts,
wishes, activities, and news — yes, for both personal and commercial blogs. Just understand
that most of your posts won’t be long-lived. For example, your post about next week’s
fundraiser is mostly pointless after the event ends. But that doesn’t mean you shouldn’t have
posted the announcement on your blog, and it doesn’t mean you should delete or unpublish it
after the event. You can also post photos and accomplishments in a post the week after. And a
few months later, your site visitors can see your announcement post, the “day of” post, the
summary post (with photos, please), and even a post looking forward to the next fundraising
event.
All in all, posts are typically time-dependent chunks of content that typically relate to other
posts (like the 4 possible posts above), which can be categorized and formatted, as we’ll discuss
in the Taxonomies section below.
Custom Post Types
A custom post type is just that — custom. A CPT can be page-like or post-like in its usage. Or it
can be used solely for bundling content in a theme or plugin scenario, not actually displayed
individually on the front-end
Custom post types solve the problem of completely separate types of content — stuff that
shouldn’t be a single page and shouldn’t be included in the site’s blog posts. Examples include
product listings, real estate listings, movie/music database, testimonials/quotes, or portfolio
items.
Organizing Posts / Taxonomies
Once you figure out the post types your WordPress site will use, you’ll want to group similar
items together. WordPress includes Categories and Tags by default for the Posts post type.
These organization tools are known as Taxonomies regardless of the post type they’re applied
to.
Categories
“Categories tend to be pre-defined and broad ranging” (Codex). For example, if you write about
social media, you’ll want to have categories like Growing Your Reach, Increasing Your
Conversions, Security Tips, and Tools to Use.
Depending on your Permalink settings, the Security Tips category would create a dynamic
“page” (dynamic display of content, not a WordPress Page post type) at
example.com/category/security-tips, at which all posts in the Security Tips category would be
displayed in descending chronological order.

Like pages, categories are hierarchical. You could have a child category of Analytics under the
Increasing Your Conversions parent category. If someone visits your
example.com/category/increasing-your-conversions dynamic page, posts added to the
Analytics child category will also be displayed, but viewing example.com/category/increasing-
your-conversions/analytics won’t display posts other than those explicitly added to the
Analytics child category
Try to keep categories “big picture” and to not have a category with less than 3 posts in it
(unless your blog is brand new of course).
Tags
Tags are similar to categories in that they’re also a taxonomy. However, they’re non-
hierarchical. In other words, like posts, there are no parent and child tags, and you can have as
many as is appropriate for your subject matter. For the social media website example, we might
have tags like Facebook, Twitter, and Google Plus.
A single post can be “tagged” with one or many tags. There could be 50 posts and 30 of the 50
are tagged with Facebook, 42 of the 50 tagged with Twitter, and 5 of the 50 tagged with Google
Plus. WordPress can then dynamically display related posts at example.com/tag/facebook and
example.com/tag/twitter, both of which would display the same post “A Smarter Way to Share”
discussing BufferApp.com. And that single post might also be in the category of Increasing Your
Conversions (dynamically generated at example.com/category/increasing-your-conversions).
Custom Taxonomies
Hopefully you now understand the basic ways to publish and organize your WordPress posts
with the default Categories and Tags taxonomies, assigned to the Posts post type. But what
about when you use custom post types? Should you really create a Testimonials post type and
tag it with Facebook or put it in the Analytics category? Probably not.
Custom taxonomies are great for organizing custom post types. Custom post types are great for
publishing similar items, as discussed above. If you have a custom movie database, your custom
post type would be Movies. You could then have custom taxonomies — hierarchical or not, like
categories or like tags, respectively — for things like the movie rating (G, PG, PG-13, R), genre,
production studios, etc.
Thinking about a database of computers (e.g. a Computers post type), you could have a
hierarchical taxonomy (like Categories) of Device Type, with items including Desktop, Laptop,
and Tablet. And a non-hierarchical taxonomy (like Tags) could be Manufacturer, with items
including Acer, Apple, Dell, HP, Sony, and Toshiba.
If we want to post about a MacBook, we would click “Add New Computer” and assign it to
Device Type -> Laptop and to Manufacturer -> Apple. Then, we could find this MacBook post
within at least these 2 URLs: example.com/device-type/laptop and
example.com/manufacturer/apple. Notice no “category” or “tag” in the URL.

You can see the power of custom post types, custom taxonomies, and how they can fit nicely
alongside WordPress’ default Pages and Posts post types. With the help of a custom post type
generator or a CPT plugin like Types (link above), creating and managing custom post types is
quick and easy even for non-techies.
Custom Fields
Custom fields are neither post types nor taxonomies. Instead, they contain data about a post,
which is why they’re called “post meta” or “metadata” (i.e. data about data). A custom field for
a Computer post could be serial number, price, or warranty length.
WordPress by default provides a way to add custom fields and insert values for existing fields,
unlike custom post types and custom taxonomies.
Author Archives
WordPress creates an author page for every WordPress user (regardless of roles and
capabilities) at example.com/author/username. For example, user John Smith with username
mrjohn will have all his posts accessible at example.com/author/mrjohn, even if he’s not an
author. If there is no username of mrjohn, WordPress will display a 404 error instead of a
message like “No Posts for John Smith.”
Author pages can be a neat way to highlight an individual’s contributions to the blog and,
depending on your theme, can display a bio and links to their own social media profiles. Check
out my ManageWP Author Page as an example.
Dynamically Created Pages
As you’ve no doubt noticed by now, WordPress displays similar posts together in dynamically-
generated pages. These pages are called Archives or Archive Pages or Archive Indexes.
Dynamically generating pages with like-kind content is one of the main benefits of using any
content management system. Author pages are actually archives just like category and tag
archives. I described those archives before this section so that you’d get the hang of “archives”
if you’re brand new to WordPress.
In summary, WordPress has a lot of ways to display content dynamically. Some WordPress
themes have distinct styling for every scenario, like category archives looking substantially
different from tag archives, for whatever reason. If not, the archive for categories and tags
would look the same but display different content.
The WordPress Blog Page
By default, a WordPress site’s home page is a “blog” front page. If desired, you can create 2 or
more new pages (probably titled Home and Blog) and then go to WordPress’ Reading Settings
and setup a static front page and a dedicated blog page.
Whether you choose to have your front page as a static page or as the default “blog posts”
front page, your blog page will display a list of your most recent posts in reverse chronological
order. Your WordPress Reading Settings allow you to control a few display options, like the
number of posts to show and whether to show the full text or a summary/excerpt.
Sticky Posts
Sticky Posts (sometimes called Featured Posts) override the reverse chronological order of the
blog page and stay at the top of the blog.
For example, if there are 5 posts dated January 7, February 3, March 10, March 20, and April 17,
they would be displayed in the order of 5, 4, 3, 2, 1. But if we made February’s post sticky (post
#2), the blog posts page would display them in this order: 2, 5, 4, 3, 1.
Note: Custom post types don’t support “stickiness”, although some plugins may enable this
feature.
Post Formats
Post Formats is a theme feature. It’s a way to display content of similar types, but notice it’s not
mentioned in the Template Hierarchy Chart above. There are quite a few built-in post formats
(explanations of each at the included link):
 aside – a post typically styled to not display the post title, like Facebook status updates
 audio – an audio file
 chat – a chat transcript
 gallery – images
 image – a single image
 link – a link to another site
 quote – a quotation
 status – a short status update, like a Twitter Tweet
 video – a single video
CUSTOMIZNG THE SITE
This part is probably the main thing on your agenda when it comes to launching a WordPress site that
fits your needs 100%.

Understanding the WordPress Customizer


In short, every modern WordPress theme allows you to customize various details of its
appearance and features through the built-in WordPress Customizer.
Many of the customizations we’re presenting in this guide involve the Customizer in one way or
the other. That’s why it’s important to get yourself familiar with it.
You can access the Customizer by going to wp-admin / Appearance / Customize. This is what
you’ll see on the left sidebar:
On the right-hand side, there’s the preview of your site – it changes in real time as you do any
modifications.
Depending on the theme you’re using and the plugins you have installed, you’ll see more or
fewer modules in the Customizer’s sidebar. Therefore, don’t worry if your sidebar doesn’t look
quite like the example above.
To begin, just spend a couple of minutes browsing through the individual sections in the
Customizer and check out what is there.
3. Set a custom header
The header together with the logo are, by far, the most identifiable parts of any WordPress
website.
Depending on your theme, the header and the logo might be regarded as one thing. In this
case, you can handle them both in one place. In this article, we will keep things standardized for
most scenarios – hence separating the two.
To work with your header, go to the Customizer, and then click on the box labeled either
“Header”, “Header Image”, or something similar (this changes from theme to theme).
If it’s your first time, you’ll probably see something like this – not much!

To begin, just click the “Add new image” button. This works just like the standard WordPress
uploader for media, nothing fancy.
There is a small caveat, though. You’ll notice that WordPress suggests certain image dimensions
for the header image:
Depending on your theme, those numbers will vary. Now, the caveat is not to pay attention to
that at all.
Yep, you’re reading this right.
What you actually do is always try to pick a high-quality, high-resolution image, and then scale
it down afterward using WordPress’ own tools.
For example, I went with a nice image that’s 1920×1080 – more than the recommended
dimensions. After uploading it, I just click “Select and Crop”:

At this point, WordPress provides me with its own set of tools for making sure that my image
fits the theme’s space limitations:
And just like that, I have a header image:

4. Set your logo and favicon


To set/upload your site logo, go to the Customizer and click on the box labeled “Site Identity”
(unless there’s a dedicated box labeled “Logo” or something similar):

Two things you’re going to do here: (a) set the logo, (b) set the site icon.
Starting with the logo. First off, setting aside all the marketing and branding qualities of your
logo, from a purely technical point of view, a good logo should be saved as a transparent PNG
file (without a background). Once you have such an image, just upload it by clicking on “Select
logo”. You will again get to use WordPress’ tools for cropping and adjusting the final image.
Here’s my result:

The next step is setting the site icon, also known as Favicon. Traditionally, the best idea is to
take your logo, remove any text from it, and then set it as the site icon. This works well because
site icons occupy very little space in the visitor’s browser bar, so the simpler they are, the more
readable they will be.
To upload your site icon, just click on “Select Image” in the Site Icon section of the sidebar.
Once done, you’ll see something like this, along with the preview of the icon:

Don’t know how to create a Favicon? Use those favicon generators instead.
5. Adjust the colors
Some WordPress themes let you customize the default colors used for things like the website
background, links, main texts, secondary texts, and more, depending on the specific theme.
You can do this all in the “Colors” section of the Customizer:
Apart from that, you can also choose from some pre-defined color schemes – visible in the
image below.
I encourage you to experiment with this and select colors that go along with your business
identity and branding.
6. Set a custom background
At this stage, most WordPress themes support customizable backgrounds, which includes not
only setting the colors – as mentioned in the previous point – but also custom background
images.
This is done in Customizer’s “Background Image” section.
Once you pick up a background image from your hard drive, you’ll see this:
Some important details:
 Background Repeat – this defines what happens when the visitor scrolls down the page
and eventually runs out of your background image.
 Background Position – self-explanatory, but switch between them to see the difference.
 Background Attachment – Scroll means that the image will scroll along with the rest of
the site content. Fixed means that the image will always stay in one place.
7. Additional theme-based customizations
Since there are thousands of themes available out there, and many of them add their own
blocks to the Customizer, covering all imaginable possibilities in this guide is simply impossible.
So at this point, we just want to encourage you to browse through all the Customizer sections
available in your current theme and experiment with what you find there.
To give you an example, there are many additional Customizer sections you can come across in
some of the more feature-rich themes:
8. Plugins to use for theme customization
Here’s a list of other useful theme customizations you can enable by installing some interesting
plugins:
 Page Builder by SiteOrigin. Great for adding entirely custom content elements and
custom layouts to your pages and posts. One of our favorite plugins.
 NextGEN Gallery. Create and showcase great-looking image galleries.
 Content Views. Nice plugin if you want to display your blog posts as a grid, rather than
the standard WordPress list.
 Unique Headers. Create original headers for individual posts and pages.
 Shortcodes Ultimate. Add custom content blocks to your website content (such as
buttons, lightboxes, lists, tooltips, and more).
 Portfolio. Use it to showcase your work/projects. Great for business websites.
 Related Posts. A very nice way to display links to related content right below your posts.
 Custom Sidebars. Create unique and customized widget areas throughout your posts
and pages – more than what’s available in WordPress by default.
 Easy Google Fonts. Truly awesome plugin if your current theme doesn’t allow you to
change the default typography.
 Strong Testimonials. A cool plugin to have if you’re running your WordPress site for a
business purpose and you’d like to showcase testimonials from your clients.
 Simple Custom CSS. Last but not least, a really useful plugin if you want to get into some
more advanced customizations involving tweaks to the CSS styling of your site.
3. Set up “Menu” and “Widgets”

We don’t think that there are many websites out there that don’t have any menus at all. Maybe
those small, business-card-like one-pagers, but that’s really not the effect we’re going for in this
guide.
You need the menus!
Here’s how to work with menus in WordPress:
Go to your wp-admin / Menus. This is where everything takes place. Begin by checking the
individual pages that you want to have on the menu, and then click “Add to Menu”:

At this point, you will see your new pages on the right-hand side. The cool thing is that if you
want to rearrange the pages, everything works with drag-and-drop. But the main thing to do
here is to assign the menu to one of the available locations and save it.
Now you have your new menu created and assigned to the main menu area.
For more variety, you can also create separate menus for your social media profiles, or anything
else that makes sense. WordPress doesn’t limit you in any way.
But where to display all those additional menus? This is where widgets come into play.
All WordPress themes come with at least one widget area, usually more. Widget areas define
the specific spaces within your theme design where you are allowed to display custom blocks of
content.
You can see this by going to wp-admin / Appearance / Widgets. There are available widgets on
the left, and widget areas on the right. What you do is quite simple – just grab a block from the
left and drag and drop it somewhere on the right.
Really cool stuff, and easy to use. Following this path, you can, for instance, take all of your
additional menus and display them as widgets.
But widgets go actually way deeper. I highly encourage you to check out the widgets you
currently have available (depends on your theme and plugins), and see what cool stuff you can
place throughout your site design to make it more interesting to the readers.
4. Confirm that Your Website is “Mobile-Friendly”

Making sure that your website is optimized for mobile viewers is more important than making
sure that it’s optimized for desktop.
It’s not that we wholeheartedly believe in the principle itself, but we do believe in the raw data.
It just so happens that mobile traffic is now bigger than desktop traffic (data is confirmed). This
means that by not having a mobile-optimized site, you’re potentially losing website traffic.
How to achieve mobile optimization?
First, you need to check if your current design is mobile-friendly. There are a couple of ways to
do that:
1. Go to automated tests.
Two popular solutions include:
 Mobile-Friendly Test by Google
 Mobile Friendliness Test Tool by Bing
There’s no inferior tool among these two. It’s a good idea to use both, and see what they have
to say about your site.
Simply go to either of the above, enter your website URL, and wait for the results. Takes only a
minute.
If you’re lucky, both Google and Bing will say that your site is optimized. That’s good. You can
stop reading this section of the guide.
If not, you will be given some suggestions and tips on what you can do to improve the situation.
We’re not going to go through that here, since every website scenario is different, and anything
I’d share here wouldn’t be applicable in most cases. In short, just follow the tips given by
Google and Bing.
Note that it’s worth to check not only the main URL of your website – the homepage – but also
a small set of subpages, particularly:
 your blog listing,
 example single blog post,
 example single page,
 any custom landing page you have.
2. Do manual tests.
You can carry out the manual tests yourself. They are more about your own subjective
impression of the site’s mobile-friendliness, rather than data-based calculations.
To begin, go to the WordPress Customizer. Take a look at the bottom left corner:

Those buttons allow you to switch between common device sizes, so you can see how the site
behaves. It’s a very handy tool, and it lets you see if everything is in order. Make sure that:
 all texts are readable,
 images aren’t too big or too small,
 ideally, there should be no horizontal scrollbars,
 the balance between image size and text size is correct (so one is not overpowered by
the other),
 the menus work properly (sometimes it’s an issue with the design on the mobile).
Apart from WordPress’ own tool, you can also use the options available in the Chrome browser.
Go to the main menu and access the “Developer tools”, or just press Ctrl+Shift+i on your
keyboard (Win).
Then you can click the “Toggle device toolbar” button:
You will be able to alternate the viewing mode between specific popular devices. For instance,
you can view your site like it appears on the iPhone 6 Plus, iPhone 5, Nexus 5X, and more.
I encourage you to use both Chrome and WordPress’ tools to really examine how your site
behaves, and check if everything is in order.
3. Fix things
If your current theme doesn’t pass the mobile-friendliness test, unfortunately, there’s not much
you can do without getting your hands dirty and going through a lot of source code.
In an extreme scenario, you might have to pick another WordPress theme. After all, if a theme
is not mobile-friendly approaching 2017, it doesn’t look good for its reputation.
Don’t panic! You can still experiment with the following. There are two alternative paths you
can take if you don’t want to change your theme:
(a) Experiment with “tune-up” plugins:
 Easy Google Fonts – This one I already mentioned earlier. You can use it to change your
typography settings in order to make texts more readable on mobile.
 Responsive Menu – Helps you fix your menus and make them mobile-friendly.
 Adaptive Images for WordPress – Helps you load your images more effectively on
mobile.
(b) Get a mobile plugin:
There’s a plugin called WPtouch. Once enabled, it checks every visitor coming to your site, and
if they’re on mobile, it displays them a separate, alternative version of your site design.
Be aware that it takes over the appearance of your site on mobile completely, so your visitor no
longer sees your current WordPress theme.
If you don’t want to change your main theme, and your site is still not mobile friendly, then the
WPtouch plugin is probably the best solution.
5. Set Up Your Homepage

For a long time, WordPress has neglected the whole idea of homepages altogether. Your only
options were to either have the default blog listing as your homepage or to take one of your
standard pages and assign it as the homepage.
These days we have a lot of options. Some of them coming from “team themes”, others from
“team plugins”.
Let’s deal with themes first.
Depending on the theme you’re currently using, you might have some custom homepage
options available. Example of a popular free theme:

All of those sections marked here take care of customizing a specific part of the homepage.
Again, those options are different from theme to theme, so we won’t get into them. You should
still closely examine what’s available in your current theme.
In a nutshell, if the theme offers any homepage customizations, use them as widely as you can.
If not, there’s a workaround.
Start by creating two new pages:
 call the first one HOME; leave it blank (no content); publish that page,
 call another one BLOG; also leave it blank and publish.
Then go to your wp-admin / Settings / Reading. There, assign HOME as the “Front page” and
BLOG as the “Posts page”:
At this point, when you go to your main domain, you’ll see a blank page.
That’s where plugins come into play. If you want to keep things free and on a budget, there are
two options:
 the previously mentioned Page Builder by SiteOrigin,
 and Live Composer.
Once you install and activate the first one, when you go back to edit your new HOME page,
you’ll see a new tab:

When you click it, you’ll go to the SiteOrigin builder. This is where you can set custom layouts
and content elements on your homepage.
Some example content blocks you can use (just a small portion of what’s available):
We’re sending you over to SiteOrigin’s documentation and examples. Those docs will show you
how to use the plugin effectively.
As you can see, tuning up your homepage can be a lot of fun. Generally, we don’t recommend
you to work with your theme’s source code to tweak the homepage manually. Even if you
somehow manage to get the visual effect that you wanted, you can never predict how the
changes are going to behave once you update WordPress, or even when viewed on other
devices. Working with your theme’s or plugins’ native features doesn’t cause the same
problems.
6. Create IMPORTANT Pages in WordPress

Speaking of the homepage, it’s also worth mentioning which other pages you can use on your
WordPress site apart from the main one.
Here’s a quick list, mainly just headlines – we’ll let you figure out what you can put on those
pages:
 About – tell people about yourself and the site.
 Contact – let your visitors contact you.
 Portfolio.
 Services and products.
 Team.
 Getting started – tell people where to get started with your content.
 Client testimonials.
 Tools and recommendations.
 Coupons.
 Content archive.
 Support.
 Career.
 FAQ.
 Advertising.
7. WordPress SEO (and what you need to do)

SEO is a crucial element for most websites on the web, and also a crucial part of website
customization. Frankly, without SEO, it’s more difficult for your audience or customers to find
you on Google. Not good!
Now, there are two sides to SEO:
1. On-page SEO.
2. Off-page SEO.
Off-page SEO is about everything you do outside of your site – talking about your brand
elsewhere, convincing people to link their site to yours, getting social media shares for your
content, etc. Let’s leave that for now.
On-page SEO is about everything you can do to optimize your individual WordPress pages to be
more Google-friendly. This is what we’re going to cover here.
WordPress comes with some built-in SEO optimizations, not many. That’s why you need a
plugin to boost things up. The most popular and the best one is called Yoast SEO.
That plugin is incredibly feature-rich. To cover all those features here would require a guide of
its own, so we’re just going to focus on the absolutely crucial stuff, and then let you do further
reading/tuning-up if you’re interested.
Let’s begin with going to wp-admin / SEO. Then switch to the “General” tab, and view
the introduction tour. It will explain how to work with the main sections of the plugin to make
your WordPress site optimized.
After that, go through each of the other tabs and provide the info you’re asked for. The
“Webmaster Tools” tab is particularly important as it allows you to hook up your site to the
Google Search Console and Bing Webmaster Tools (both deliver crucial insights about your
site’s SEO health).
Next, go to wp-admin / SEO / Titles & Metas, and fill in all your preferred page titles and meta
descriptions. This helps to optimize the default versions of those pages. If you’re not sure about
some of the toggle switches, you can safely leave them with their default values.
The next section – wp-admin / SEO / Social – is where you can hook up your social media
profiles, and enable both Facebook Open Graph and Twitter Cards – those will help you get
your content more visible on those platforms.
Next, go to wp-admin / SEO / XML Sitemaps. Basically, the only thing you need to do there is to
make sure that the sitemaps are enabled (the top toggle button). XML sitemaps are used by
Google to navigate your website and eventually get to your individual posts and pages.
At this stage, you’re pretty much done with the main settings, but you should also have a look
at your individual posts and pages, and tweak their specific SEO parameters too. In short, when
you go to edit any post or page, you’ll see this box at the bottom:
 (a) – the main SEO snippet that’s visible in Google searches. Tweak this first.
 (b) – the main focus keyword of the page. Set it to the phrase what’s the most
important for you when it comes to that specific page.
 (c) – tips on how to optimize your page based on the focus keyword.
 (d) – additional tab offering tons of useful tips on how to improve the page’s readability.
Note. It’s crucial to tweak the SEO parameters for your most important posts/pages, including
the homepage!
8. Add Social Media Integration

The last thing we’re going to take care of when it comes to tweaking and customizing your
WordPress site is getting some proper social media integration!
Social media is essential! It’s how a big part of your audience even finds your content, and it
also has an impact on your SEO (this has been proven by Moz.com some time ago).
Long story short – your goal with social media integration is to:
 make it easy for people to share your content,
 make those individual shares optimized,
 share content yourself effectively and at the right time,
 be on all the main social networks,
 make it easy for people to follow you,
 track your social media popularity.
Here are the tools that will help you do so:
 Share/like buttons. The best way to get yourself some of those is to use the Share
Buttons & Analytics by GetSocial plugin. It’s free, and it gives you a set of very good-
looking and functional buttons for all networks. Plus, you can place those buttons in
various places through your site design (no matter what theme you use).
 Posting your content automatically. A very neat trick you can implement to make your
work with social media much easier is to get yourself some kind of an auto-posting
plugin. The one I recommend is called Revive Old Post. After a short configuration, it will
pick a random post from your archives, and share it across your social media profiles.
 Make your shares look good. By default, if someone shares your content on social
media, the share itself includes just the title of the post and a link to it. However, if you
get a plugin like WPSSO, you can include images into the structure of the shares, plus
make them much better looking and thus much more likely to be spread.
 Follow buttons. Lastly, you need some nice follow buttons that will encourage your
visitors to add you as a social media friend. There’s a great generator for Twitter here,
and a plugin to get a similar thing for Instagram.
WHAT ARE PLUGINS?
A plugin is a software add-on that is installed on a program, enhancing its capabilities.
WordPress plugins are bits of software that can be uploaded to extend and expand the
functionality of your WordPress site
USERS & USER PROFILES
WordPress comes with a user role management system which defines what a specific user can
and cannot do on your website. Knowing these user roles and permissions are essential as your
WordPress site grows. In this beginner’s guide to WordPress user roles, we will compare each
WordPress user roles and permissions in an easy to follow infographic.
Out of the box when you install WordPress, there are five default user roles:
 Administrator
 Editor
 Author
 Contributor
 Subscriber
1. Administrator
On a regular WordPress install, Administrator is the most powerful user role. Users with the
administrator role can add new posts, edit any posts by any users on the site, and even delete
those posts.
They can install, edit, and delete plugins as well as themes. Most importantly an administrator
user can add new users to the site, change information about existing users including their
passwords as well as delete any user (yes other administrators too).
This role is basically reserved for site owners and gives you the full control of your WordPress
site. If you are running a multi-user WordPress site, then you need to be very careful who you
assign an administrator user role.
We also recommend that you read this article: Should You Give Admin Access to Plugin
Developers for Fixing Bugs?
2. Editor
Users with the editor role in WordPress have full control on the content sections your website.
They can add, edit, publish, and delete any posts on a WordPress site including the ones written
by others. An editor can moderate, edit, and delete comments as well.
Editors do not have access to change your site settings, install plugins and themes, or add new
users.
3. Author
As the name suggests, users with the author role can write, edit, and publish their own posts.
They can also delete their own posts, even if they are published.
When writing posts, authors cannot create categories however they can choose from existing
categories. On the other hand, they can add tags to their posts (See: Categories vs Tags – Which
one is better for SEO?).
Authors can view comments even those that are pending review, but they cannot moderate,
approve, or delete any comments.
They do not have access to settings, plugins, or themes, so it is a fairly low-risk user role on a
site with the exception of their ability to delete their own posts once they’re published.
4. Contributor
Contributors can add new posts and edit their own posts, but they cannot publish any posts not
even their own. When writing posts, they cannot create new categories and will have to choose
from existing categories. However, they can add tags to their posts.
The biggest disadvantage of a contributor role is that they cannot upload files (meaning they
can’t add images on their own article).
Contributors can view comments even those awaiting moderation. But they cannot approve or
delete comments.
They do not have access to settings, plugins, or themes, so they cannot change any settings on
your site.
5. Subscriber
Users with the subscriber user role can login to your WordPress site and update their user
profiles. They can change their passwords if they want to. They cannot write posts, view
comments, or do anything else inside your WordPress admin area.
This user role is particularly useful if you require users to login before they can read a post or
leave a comment.
Bonus: Super Admin
This user role is only available on a WordPress Multisite Network. Users with the super admin
user role can add and delete sites on a multisite network. They can also install plugins and
themes, add users, and perform network wide actions on a WordPress multi-site setup.
Customizing Existing User Roles
Default WordPress user roles are designed to have capabilities that fits the requirement of
most websites. For example, if you run a magazine site, then you can assign Editor user role to
your senior staff and author user role to the junior staff. You can assign contributor user role to
your guest authors and subscriber user role for your site visitors.
But what if you wanted to modify the permissions of an existing WordPress user role?
One thing we do not like about the author role is that not only can they publish their own posts,
but they can also delete them after it’s published. This can undermine your entire editorial
workflow. Also can be disastrous if a paid author leaves on bad terms and decides to delete all
the posts they wrote (the ones you paid them for).
Let’s suppose that you want to modify the author user role, so that the authors cannot delete
their posts once they’re published.
First thing you need to do is install and activate the Capability Manager Enhanced plugin. Upon
activation, go to Users » Capabilities to modify user roles.
GENERAL CONFIGURATION SETTINGS
The WordPress general settings page lets you set up some basic conventions about how your
WordPress site will be displayed, including title, timezone, format for date and time, and more.
Some of the defaults may be fine for your needs, but whenever you set up a new site, it’s a
good idea to double-check everything on this page.
To access the WordPress general settings, use the WordPress dashboard sidebar to click on
Settings -> General.
Site Title
The title may be displayed in several places, including the web browser title bar, and the header
(if your chosen theme has that option). It also appears on the Admin bar in the upper left, if
you’re in the dashboard or viewing the site while logged in. Some themes have the option to
include the Site Title as part of the title tag on each page, and it may also be used as an
identifying name in your syndication feeds.
Tip: the site title doesn’t need to be an exact match for your site name, or URL. So make it
readable, and include keywords if possible.
Tagline
This spot provides a place to include a description or short, memorable phrase that describes
more about your site. Some themes also display the tagline in locations such as the header or
sidebar. This field can be left blank.
Tip: For most installations, the default tagline will be “Just another WordPress site,” so be sure
to check that and either change or remove it.
WordPress Address (URL)
This is the actual location of your WordPress installation and core files. For many sites, that will
be the same as the URL your site visitors enter to view your site. However, if you’ve installed
WordPress in a sub-directory, you’ll want to use that here.
Site Address (URL)
This is the address visitors will type into their browser to view your site.
Tip: don’t include a trailing slash in either URL.
Email Address
WordPress sends various messages about administration and maintenance tasks, to the email
address entered here. For example, if you want to be notified when new comments are posted
in response to one of your blog posts, they will go to this address. Or if you allow users to
register for membership in your site, new member notifications will go to this address. This
email is not displayed anywhere on the site, so it’s protected in terms of visibility.
Tip: Note that this does not need to be the same as the Administrator user account.
New User Default Role
If you’re allowing new users to register for an account on your site, you’ll want to select a
default role for them (administrator, editor, author, contributor, subscriber).
Time zone
All WordPress installations default to UTC (Coordinated Universal Time, which is actually in
London, England). The dropdown list lets you choose a time relative to UTC (such as “UTC+9”)
but there’s also a convenient list of cities organized by continent. While your city may not be
listed, you’ll surely find one that works. For example, if you live in San Francisco, which is not
listed… Los Angeles is in the list and we know that’s the same time zone.
Tip: Once you set the time zone, your local time will be shown below that selection box, so you
can double-check that it’s correct.
Date Format
By default, the date format is April 27, 2017, but other popular options are available, such as
4/27/2017, or 2017-4-27. There’s also an option to customize, and the WordPress Codex has
details for specifying custom formats.
Tip: Today’s date is shown in the different format options, so you’ll know exactly what you’re
selecting.
Time Format
Again there is a default, with several other formatting options, and the ability to specify a
custom date.
Week Starts On
Let’s you select whether you’d like your week to start on Sunday, Monday, or any other day, for
that matter! This is a helpful setting if you are using a calendar widget that wants to know how
to format weeks, as it would control the day displayed in the far left (first) column of the
calendar.
Site Language
Let’s you select which language is used in the dashboard, from an extensive dropdown list.
WORDPRESS BACKEND

The Top Bar

Once you’re in the back end, there will be quite a bit on the screen to digest. This tutorial will
focus primarily on the top bar and the left-hand sidebar. In this section, we’ll go over the top
bar.
At the very left-hand side of the dashboard, you’ll see the WordPress logo. Clicking on that will
give you some basic information about your WordPress site, such as the version of WordPress
that you’re using.

The name of your site should be to the right of that. If you click on that, you’ll be taken to your
site’s home page. It’s a valuable link to click when you’ve made configuration changes so that
you can immediately view how those changes have impacted your site.
To the right of that is a speech bubble. That shows you how many comments are on your site. If
you click on the bubble, you’ll be taken to a new screen that allows you to edit the comments.
To the right of the speech bubble, you’ll see the word New with a plus sign in front of it. If you
click on that link, you’ll be taken to an edit screen that enables you to add new content to your
site. Note that if you hover over the New link, you’ll see a drop-down menu that shows you
what types of content you can add.
On the far right of the top bar you’ll see your name. If you hover over your name, you’ll notice a
drop-down menu that gives you the option to edit your profile or log out of the back end.

The Left-Hand Navigation Bar


The left-hand navigation bar is probably where you’ll spend the lion’s share of your time as you
work in the WordPress back end. Almost all of the options that you want to access are on that
section of the screen.

It should be noted that the contents of the left-hand navigation bar will vary slightly (if not
significantly) from installation to installation. That’s because installed plugins can (and often do)
add new options to the sidebar. This tutorial will cover the basic options.

Dashboard
At the very top of the left-hand navigation bar is the word Dashboard. If you click that, you
might notice that the page loads but nothing happens. That’s because the dashboard is the
same thing as the default view of the back end. In other words, you’re already on the
dashboard. So, if you’re ever “lost” and not sure how to get back to the initial screen on the
back end, click this link.
Posts

This is the option you use to create, edit, update, and delete posts. If you hover over it, you
might notice a fly-out menu that appears. That menu will give you the option to view all of your
posts (which you can then edit or delete), create a post, view your tags, or view your categories.
If you opt to create a post, you’ll be taken to a screen that enables you to create content in
WYSIWYG (What You See Is What You Get) format. The icons at the top of the editor are very
similar to what you would expect to see in any word processor. The right-hand sidebar on that
screen gives you the opportunity to add categories, tags, and add a featured image to your
post.

Media
This is the option that you click if you want to view media that’s used on your website or add
new media. In WordPress, media can be defined as images, recordings, videos, or other files.
However, most of the time you upload media, you’ll probably be uploading an image.
The flyout menu that appears when you hover over the Media option gives you two additional
options: Library and Add New. If you select the Library option, you’ll be taken to a screen where
you can browse your media uploads. If you click Add New, you’ll be taken to a screen where
you can upload images directly from your personal computer.

Pages
The Pages option functions similar to Posts except that it deals with pages. You can manage
your pages or create a new page. This is the option you use if you want to create a “Contact”
page or an “About Us” page.

Comments
It is strongly recommended that you adopt a more sophisticated comments system than the
default option that comes with WordPress. Whatever system you select, you click this option to
manage the comments that are on your site. This is also how you delete comments that are
spam.

Appearance
Simply put, this option enables you to change the look and feel of your website. If you hover
over it, you’ll see numerous options in the fly out menu that appears:

 Themes: Select this option if you want to change the overall look and feel of your
website. You can download some great themes for free from the WordPress website.
 Customize: Click on this option if you want to change your site title and tagline.
 Widgets: This will take you to a screen that shows you all of the widgets that are
available to you. You actually “use” the widgets by dragging them to sections of the
screen identified as graphical user interface (GUI) boxes. For example, you might drag a
widget called “Latest Posts” from the left-hand side of the screen to a box that reads
“Right Sidebar” on the right-hand side of the screen. That will display your latest posts
on that sidebar on your site.
 Menus: This will give you the option to manage your menus. You can create new menus,
specify where you’d like the menus to appear, and add items to each menu. These
menus will be displayed differently from theme to theme.
 Editor: This is for advanced users. If you’re interested in changing the source code of
your theme, you would go here, select the correct file from the right-hand sidebar, and
make the necessary changes.
Plugins

Click on this option if you’d like to review the plugins that you have installed or if you’d like to
install a new plugin. Keep in mind that adding a new plugin will often change the contents of
the left-hand navigation bar.

Users
You might not be the only one who uses your website. It’s possible that you rely on an army of
authors and editors to create content for you. Click on this option to create, delete, and
manage your team of users.

Settings
If you hover over the Settings option, you’ll see a flyout menu that gives you several other
options:

 General: Click this option if you’d like to change basic configuration information about
your site, such as its title, tagline, or the email address of the site administrator.
 Writing: Click this option to configure basic information about your posts, such as the
default category and the post format.
 Reading: Click this option if you want to set information about how your site is displayed
to visitors.
 Discussion: Click this option if you’d like to configure how your comments section is
structured.
 Media: Click this option to specify default dimensions for images of various sizes.
 Permalinks: Click this option to configure how you’d like permalinks to appear on your
web The Top Bar
MAINTAINCE
Your WordPress database contains every post, every comment and every link you have on your
blog. If your database gets erased or corrupted, you stand to lose everything you have written.
There are many reasons why this could happen and not all are things you can control. With a
proper backup of your WordPress database and files, you can quickly restore things back to
normal.
Site backups are essential because problems inevitably occur and you need to be in a position
to take action when disaster strikes. Spending a few minutes to make an easy, convenient
backup of your database will allow you to spend even more time being creative and productive
with your website.
There are two parts to backing up your WordPress site: Database and Files. You need to back up
the entire site, and you need to back up your WordPress database. Below are instructions for
backing up your WordPress database for various server programs. We will start with backing up
the rest of your WordPress site.
Your WordPress site consists of the following:
 WordPress Core Installation
 WordPress Plugins
 WordPress Themes
 Images and Files
 JavaScript and PHP scripts, and other code files
 Additional Files and Static Web Pages
All of these are used in various combinations to generate your website. The database contains
your posts and a lot of data generated on your site, but it does not include the above elements
that all come together to create the look and information on your site. These need to be saved.
Most hosts back up the entire server, including your site, but it takes time to request a copy of
your site from their backups, and a speedy recovery is critical. You need to learn how to back up
your own site files and restore them.
Here are some methods to backup your site files:
Website Host Provided Backup Software
Most website hosts provide software to back up your site. Check with your host to find out
what services and programs they provide.
Create Sync with your Site
WinSCP and other programs allow you to sync with your website to keep a mirror copy of the
content on your server and hard drive updated. It saves time and makes sure you have the
latest files in both places.
Copy Your Files to Your Desktop
Using FTP Clients or UNIX Shell Skills you can copy the files to a folder on your computer. Once
there, you can zip or compress them into a zip file to save space, allowing you to keep several
versions.
Remember, keep at least three backups on file, just in case one is corrupted or lost, and store
them in different places and on different mediums, like CD, DVD, different hard drives, etc.

You might also like