a step by step guide on word press website
DESCRIPTION
A step by step guide on word press website for starters. This guide has 5 chapters which will reveal that whats the correct procedure to install featured & free wordpress themes, install important plugins like Yoast SEO and social sharing button, creating pages and a menu bar and having complete control in menu structure, Assigning home page and blog post page etc.TRANSCRIPT
A step by step guide on WordPress website for startersBy Jatin Chhabra
This is the Dashboard Panel of wordpress sites. To open this just add /wp-admin
after your website url. Ex- www.abc.com/wp-admin
This is the Dashboard of your wordpress site. In this guide I will cover every basic detail a started needs to know on “How
to create a Wordpress website”
Ch 1-Change the website theme & install 2 important Plugins. Slide 5Ch 2-Create a minimum of 5 pages {number of pages depend upon your requirement & industry} Slide 33Ch 3- Create a navigation menu and properly sort the Menu Bar Slide 43Ch 4- Setting Home page and Blog Post. Slide 57Ch 5-Add content, images & video on a Page. Slide 69
CHAPTERS
Ch 1-Change the website theme & install 2 important Plugins. (Yoast SEO & Simple Share Button)
WordPress Free Themes
Click on Appearance or Theme on your WordPress website Dashboard.
Currently we have 3 themes available in our collection (these are default themes which are naturally available when we install wordpress) Now click on “Add new” to get knowledge on how to install a free wordpress theme.
Either choose theme from the below configurations or click of “Featured” to get some of the finest free wordpress themes freely available.
Choose a fine theme from the below list and click on “Install Now” below the any theme preview. Here I have chosen the one in the 2nd row, right hand side.& name is Sixteen
Now just click on “Activate” to install the selected theme and add it in your existing theme collection.
Now we have a installed a new theme on our website and its “Active”. Just open website in a new tab and have a view of your new theme.
Now we have properly installed a new theme. Now go back to your wordpress dashboard where we will install 2 important plugins.
WordPress Plugins
Now click on Plugins to install “Yoast SEO” plugin which we will use to update the “On Page” details of every webpage of our website.
Now click of “ADD NEW” button from any of these 2 buttons.
Type “YOAST SEO” in the Search box and click on “Search Plugins”
Now make sure that you install the original Yoast Seo plugin. So choose and click on INSTALL NOW on “Wordpress SEO by Yoast created by the famous Joost de Valk.
Now make sure that you install the original Yoast SEO plugin. So click on INSTALL NOW on “Wordpress SEO by Yoast plugin created by the famous Joost de Valk.
Click on “Activate Plugin” to activate WordPress SEO by Yoast.
Now we have one more Plugin in our “Installed Plugin” collection. You will also notice a pop-up by Wordpress SEO which is seeking your permision for tracking. You should allow this.
Now we have one more Plugin in our “Installed Plugin” collection. You will also notice a pop-up by Wordpress SEO which is seeking your permission for tracking. You should allow this.
Anther important plugin which we should have is a Social Sharing Button plugin. There are many free and paid plugins of social sharing. Here we will install “Simple Share Buttons Adder” by “David S. Neal”. So just click on “Add New” button.
Type “Simple Share Button” in the search box and click on Search Plugin.
Now click on Install Now below Simple Share Button by David S Neal.Now click on Install Now below Simple Share Button Adder by David S Neal.
Click on Activate Plugin
Now click in configuration to update the settings of Social Share Button.
Now click in configuration to update the settings of Social Share Button. Either click on configuration above or click on Settings under our installed Simple Share Buttons Adder.
Choose the location where you want your social share buttons should appear. So lets choose Homepage, Pages and Posts.
The 2nd option is Placement. Here the plugin is asking us that do you want to show the social share button After the content, Before the content or Both. So lets Choose Both.
3rd option is Share Test. I will suggest to remove this content as this feature will automatically create a link on your website of the Plugin Creator. So just delete the content “Don’t be selfish”
Now scroll down and check the nest slide.
4th Option is Image Set where we can choose from the available custom made share button options. Currently just choose the default one Somarca.
Now we will drag Social Media Platform from the “AVAILABLE” section and drop them in “SELECTED” section. Then just click on SAVE CHANGES button in the bottom of the page.
After clicking of save you will get this message that Your settings have been saved. Now click on “Counters”
Check the SHOW option is Share count. This feature will allow to show the total numbers of social share you web page receives.
Let the other 2 settings remain as default and click on Save Changes in the bottom.
Now we have successfully installed our Social Sharing Plugin (Simple Share Button)
Ch 2- Create a minimum of 5 pages {number of pages depend upon your requirement}
Click on Pages or All Pages on your Wordpress Dashboard
CLICK ON PAGESYou will notice that you already have a existing page on Pages Section with the name of Sample Page. Now we will start creating 5 new pages along with this Sample Page. So just click on “Add New” from the available 2 options.
Write the title of your page ex- Home (Which I have written) and just write some content in the below content box. View the next slide.
On the same page you have a Publish box. Here you can save the work by clicking on Save Draft, preview the look & feel of the page by clicking on Preview button or in this case click on Publish button to create the page.You also have a 4th option “Move to trash” to delete to page. So just click on the blue Publish to create a page.
Save Draft
Publish Button
Preview
Now you can notice that we have “Update” written instead of “Publish” and above we have 2 new buttons “Edit” and “Get Short Link”Via edit you can change the url content of your page and via short link you can get a new short URL for your page, which we do not prefer.
Now click on All Pages under Pages section to view that how mane Pages we have created till now.
Now you can see that we have 2 web pages (Home and Sample Page). Also below a published page we get 4 options- Edit, Quick Edit, Trash and View. We only get these 4 options in a published page.
If you written some content and not clicked on update (or have clicked on save draft) you will have a page mentioned in the All Page list but there will be a Draft mentioned along with page title. Which implies that the page isn’t live or Published.
Now as we have created Home page. So create 4 more pages with the same process. From “Add New to Publish”
So I have created 4 more pages (About Us, Blog, Contact Us and Services) with the same procedure as we created Home Page.
Ch 3- Create a menu and properly sort the Menu Bar
As you can see that the pages which I have created gets automatically update on the site’s Menu Bar. Though I haven’t saved or created any Menu Structure, plus I want to arrange the pages as per my choice. Like I want Services in place of Blog and remove an extra Home option from the menu Bar. So to do so I will return back to my Dashboard.
Click on Menus under Appearance.
1st I will type a name (any name) in the Menu Name and click on Create menu button from any 2 options.
You will notice that we have a new tab option name Manage Locations after saving a menu name. So just Click on that.
Here we will Choose our Primary Menu (the one which we want to display on our website). So just click on Select a Menu.
Now I am getting an option name Menu 1. This is the name which I have given while I created a Menu in slide 46. So just choose your created menu and click on Save Changes, right hand side.
You will get this line that “Menu Location Updated”. Now just click on Edit Menu above this line.
This is Menu Structure and in the same order your website menu is visible. Here we will 1st Remove the extra Home tab which has Custom mentioned on it. So just click on it.
And just click on Remove.
So we have removed the extra Home page. Now just arrange the menu tabs. Here we just need to drag the page and drop the as per our requirement.
Now I have arranged the pages as per my requirement (Home, About Us, Services, Sample Page, Contact Us and Blog). So now I will just click on Save Menu
Come back to your website and refresh the page and you will find that the menu bar structure is as per your selection.
1. If in future you are creating any new page and you want that, the new page automatically gets added in your created Menu Structure than just tick Auto Add Pages below your saved Menu Structure.
2. Or you can leave it blank and every time you create a page than go to Menus section, tick the page under Pages section and click on Add to Menu to land that new page in your saved Menu Structure.
Ch 4- Setting Home page and Blog Post.
Click on Customize under Appearance.
Click on Static Front Page.
Choose A Static Page
Click on Select under Front Page.
Now Choose the page which we want to make as your main index page. Like websitename.com. So lets choose Home over here.
Click on Select under Post Page.
Now Choose the page which we want to make as the blog post page. Like websitename.com/blog. So lets choose Blog over here.
Click on Save & Publish
Now just click on Close.
Now our Home page is our main page.
And our Blog page is the main page where our posts will be visible..
Ch 5- Add content, images & video on a Page.
Click on Pages to open an existing Page.
Click on Pages to open an existing Page.
Click on Edit below any page. Here I have chosen About Us.
The above is the Title Box where we mention the Name of the page and below is the content box where we will 1st write some content
I have just written 3 line content as Heading 1, 2 & 3 and now we will convert them in H1, H2 and H3 tag which we learnt on On-Page SEO class.
1st select Heading 1.
And than click on content style tab in the 2nd row. If you aren’t viewing 2nd row than just click on the last icon of 1st row,
Now we have converted 1st line content as H1 tag. Similarly do the same for Heading 2 and 3 and convert them as H2 & 3 tag.
Select content in 2nd row.
Choose Heading 2.
Select content in 3rd row.
Now we have converted all three lines as H1, H2 & H3 tag. So just click on Update and view the page is a separate window.
Always update any changes made in a page otherwise that won’t be saved. After clicking on update. Just click View Page below Title box “About Us”.
All H1, H2 & H3 tags are properly updated. Now we will add some content below these Headings,
Return back to About Us page and write some content below Heading 3.
After adding content, click of update to save the work. Then go back to your site About us page, refresh it and view the changes.
Content below Heading 3 is live on About Us Page
Now lets add a Picture below the content.
1st click in Add Media button.
A pop-up will appear with the name of Insert Media. Above you have 2 options “Upload Files” from here we upload pictures in our website from our computer, which we will do in next slide and 2nd is Media Library which will be the collection of all of our images which we have uploaded from our computer.
We are in Upload flies and we will click on Select Files to upload images from our computer.
Now choose any image from your computer and click on Open
The image has been updated. But before updating this image in our page we will update some settings. Check next slide.
On right hand side we will make some changes in image structure. Title, Caption & Alt Text. Alt text is important as here we mention what image is about for search engines. Caption is the content which is visible below the image which will be visible on the page and Title is the heading of the content. So just mention the same content which you have added in caption. 4th description is optional.
Below we have ATTACHMENT DISPLAY SETTINGS. Here 1st option is Alignment (used to select the alingment of the image on the page), 2nd is Link to (preferably I will choose none) and is the size (always prefer the exact size of the image) and just click on Insert Image button in the bottom right.
Image is inserted in the page so just click on Update and check the update on your website. (Do refresh your website after every update)
Image is properly updated in the About Us page of our website.
And lastly we will add a YouTube video below the image. So 1st click on Text.
This the HTML structure our work which we have previously added. But in order to add a video we need to add a “Embed Code” which is in HTML structure.
How to get this code? Check the next slides
Open any video on YouTube and click on Share tab.
Now click on Embed.
This is the Embed Code which we will add in the HTML structure discussed in slide 84.
Paste the Embed Code from the previous slide and click on Update.
Refresh your page and you will find a YouTube video. (You can always change the size of this video.
Updated H1, H2 & H3 tag.
Content or Paragraph
Image with Caption and Alt Text
And a Video
That’s all folks