table of contents · look for a file named wp-config-sample.php and rename it to: wp-config.php now...

1 / 61 Note: File names, Folder Names, Domain Names and other textual labels used within this tutorial is completely hypothetical and has no relation with any real life projects

Table of Contents

1 How to build a web site with Word Press (WP)? 3

2 Install Word Press 3

3 Start Designing your Word Press website 4

4 How to change Admin Password? 4

5 How to add www prefix on your web site? 5

6 How to install a new Theme? 5

7 Adding content and creating new pages 6

8 To create SEO Friendly URL of the Page 7

9 How to add a Contact Page with a Google Map Embedded? 7

10 How to create one Contact Form? 7

11 How to remove Comment Boxes at the Bottom of the Page? 8

12 How to create a Web Page and embed you tube video? 9

13 How to Edit / re-arrange the Menu and Delete the Sample Page 9

14 How to customize the Home Page? 9

15 How to change the Image on the Front Page? 10

16 How to Modify Widgets on the Home Page? 11

17 How to Download and Install a Plug-in for a Visual Editor? 12

18 How to change and add a custom Logo to your web site? 13

19 How to Control the Side Bar Area of your Word Press web site? 13

20 Posts 13

21 Tweaking your website (Widgets, comments & just some “stuff” you need to know), Changing website title & tagline, Disabling comments under Posts & Pages, Static front-page, Forum

14

22 Word Press Caching Plug-in - W3 Total Cache (W3TC) 15

23 SEO Plug-in 23

24 APPENDIX 31

25 Word Press Vulnerability and how to fix them SQL Injection & URL Hacking Access to Sensitive Files. Default Admin User Account Default Prefix for Database Tables Brute-Force Login Attempts

50, 51, 52, 53,

53, 53

26 How to speed-up your word press web site Identify Plug-in That Are Slowing You Down Compress Your Website Compress Images Leverage Browser Caching Clean Up the Database Minify CSS and JavaScript Files Turn Off Pingbacks and Trackbacks Specify Image Dimensions and Character Sets Move CSS to the Top and JavaScript to the Bottom Use CSS Sprites Enable Keep Alive Replace PHP With Static HTML Where Appropriate

55 - 59

27 List of Essential Plug-ins for WP 60-62


How to build a web site with Word Press (WP)?

Install Word Press

Download Word Press from here: http://wordpress.org/download

Create a new folder on your local PC`s desktop and unzip Word Press in it

Look for a file named wp-config-sample.php and rename it to: wp-config.php

Now open the wp-config.php (with notepad for example) and fill the following lines:

define(‘DB_NAME’, ‘database_name_here’); – Database name (if you don’t know it, ask

this from your hosting support)

define(‘DB_USER’, ‘username_here’); – Your database hosting username

define(‘DB_PASSWORD’, ‘password_here’); – Your database hosting password

After you have filled the gaps, save the file.

Now log into your hosting ftp - using filezilla or a FTP Client.

create a new folder to upload your word press site or you can also upload your word press site

on your hosting root directory

If there is any file named “index” within your target folder – delete it.

After that upload all the files from your local Word Press folder to your hosting servers root

directory or the new folder you just created on your FTP server.

Once you have completed previous steps, go the URL: yourdomain.com/wp-admin/install.php or

yourdomain.com/new-folder/wp-admin/install.php

This is the page you should see:


Just fill in the forms and you are ready!

Start Designing your Word Press website

Once you have successfully installed Word Press to your hosting server, you’ll see very basic yet clean site on your URL yourdomain.com or yourdomain.com/new-folder/ :

1) Log into your Word Press admin dashboard in order to change themes and start building your site – you can log in from http:// yourdomain.com/wp-admin or http://yourdomain.com/new-folder/wp-admin

This is your Word Press dashboard:

Note: Word Press Dashboard links, buttons and location of those button might change from version to version

How to change Admin Password? a. On the Dashboard go to Users => Your Profile b. Scroll down the page to new password and type it in. c. Enter New password: d. Enter Repeat New password: The Dashboard will tell whether or not your picked a strong password. Then click update profile.


How to add www prefix on your web site? DEFAULT WEBSITE URL does not Include www - here is how to add the www prefix To change your web address from yourdomain.com to www.yourdomain.com i.e. add www to the prefix follow these steps. a. In the Dashboard select Settings => General b. Word Press Address URL: http://yourdomain.com/wp/ c. Site Address URL: http://yourdomain.com/wp/ d. Change to:

e. Word Press Address URL: http://www.yourdomain.com/wp/ f. Site Address URL: http://www.yourdomain.com/wp/

Then Click Save Changes at the bottom of the page Note: On your local PC while you are running as http://localhost/wp/ - do not change Word Press Address URL and/or Site Address URL How to install a new Theme?

In the Dashboard select a. Appearance => Themes b. Add New => Featured Here, you should see a variety of possible Themes. You can also search for more Themes. c. Select a Theme e.g. We are going to install the Responsive Web Theme by emiluzelac (which means the theme will automatically size itself for mobile devices, tablets and desktops. You can select Install Now | Preview | Details - its good to look at the design rating and a larger preview first. If you like the design Then you can select Install Now. If the Theme RESPONSIVE is not feature, select Search and you can search for it, or other themes. The Responsive Theme is featured at the top left – if it isn’t Select Search => type in Responsive. You can select any of the Themes shown or search for more. You can also search online for more free Themes and some Themes can be purchased. Click Install Now => Then click Activate and click on My Blog at the top to visit your site and see the new Theme has been inserted.


As you can see above, installing new theme (outlook) to your website is very easy. All you need to do is look for specific keywords and/or use filters.

Once you have found the theme you like, click “Install” and “Activate” afterwards:

Finding a perfect theme can take a while, but it’s worth it. In case you don’t find anything good right away, you can always return and search more later on. Changing themes won’t delete your previous posts, pages and content. In other words, you can feel free to change it more than 5 times a day.

P.S: In case you want a theme that works well on mobile phones, look for the keyword: “responsive”.

Adding content and creating new pages

Once you have installed the theme you like, you can start creating content. Adding new pages in Word Press is again very easy, but I’ll cover the basics for you:

Pages: In order to create new pages such as “About Us”, “Resources” etc., you need to head over to Word Press dashboard and look for “Pages => Add new”.

If you want those pages to appear on the menu as well, you need to go to “Appearance => Menus” and add them to the list.


Steps: Pages => Add New Title type in the title of the page e.g. About Us Add some text below in the Text box Visual, then To add a picture Click on the camera icon beside Upload/Insert or Add Media Then, click Select Files - browse your computer and select image. You may have to edit the image so select Edit You may resize the image by selecting Scale Image You can also, crop, flip and modify the image in other ways if you like.

To crop you click and drag over the image then select the crop button After modifying your image click on Save Then Publish the Page

To create SEO Friendly URL of the Page

In the Dashboard select: a. Settings => Permalinks b. Select { Post name } => Save Changes How to add a Contact Page with a Google Map Embedded?

This exercise assumes that you know - how to customize a Google map e.g.

Create a Google Map to your desired location Save it to your Google Account / My Places Click the Link icon to display your embed options Either select the default link code from here or customize your options further by clicking the customize link. Set your map size parameters Set your desired zoom level Navigate to the final field on this page, select all the code and copy it to your clipboard

Now, on the Word Press Dashboard select:

a. Pages =>Add New b. Enter Contact Us - In the Text box below c. Add Phone Number, Email address d. Now paste the customized Google Map Code where you want the map to show on this page e. Before pasting the customized Google Map Code - select HTML tab and do not go back to the visual tab for this page - otherwise, Word Press will truncate your code and you will lose your Map f. Then, update your page and Publish

How to create one Contact Form?

Return to the Word Press Dashboard and, select:

a. Plug-ins => Add New b. In the Search box type: Contact form 7 c. Now, select Contact Form 7 and press Install Now => then Activate it.

In the Dashboard you will see a new menu option on the left called Contact > Click on it then Mouse over Contact form 1 and Select

Copy


This will take you the Contact form 1_copy page where it asks you to copy the contact form text in brown box into your post, page or text widget content. Select the text – copy it.

How to remove Comment Boxes at the Bottom of the Page?

Let us now take the example of the Contact Form - just now created above. You will see that, there is a Comment Box at the bottom of the page saying { Leave a Reply } and with a { Post Comment } button.

a. After testing the Contact Form on the Front-end

b. Click edit page on Word Press dashboard and,

c. At the Top Right corner - select Screen Options and,

d. Check Discussion in the check boxes at the top

e. Scroll down to the bottom of the page and uncheck Allow comments and Allow track backs and ping

backs on this page

Now, on the Word Press Dashboard Select:

a. Pages => Add New

b. In the Title box Type in “Ask a Question” and,

c. In the text box below type in: Ask me a web development Question.

d. Then below this paste the code you copied from the brown selection box above.

e. Click Publish and view the page.


f. Then Click UPDATE on the page.

Note: To remove comments from other pages Go to Pages – select the other pages and repeat for each page you don’t want visitors to leave comments. (You can visit each page, select Edit and then remove the Comment as described above).

How to create a Web Page and embed you tube video?

a. Go to Word Press Dashboard and select,

b. Pages => Add New page

c. Type in “How to Create a Web site” in the title area

d. Place a cursor in the text box area

e. Then open your browser and, select the you tube video link you wish to embed e.g. https://www.youtube.com/watch?v=8Jv47_VIBOQ

f. Click on the Share button, click on Embed, select the 480 x 360 size movie and copy the iframe code e.g.

<iframe width="480" height="360" src="//www.youtube.com/embed/8Jv47_VIBOQ" frameborder="0" allowfullscreen></iframe>

g. Return to the Dash board, select the Text input box select the HTML tab and paste in the text box. You can also add some text before the video e.g. This video will show you how to create a web site

h. Click Publish then View Page and you should see the web page with the movie embedded and a new header in the top Menu Bar

i. Remove the comments as described above

How to Edit / re-arrange the Menu and Delete the Sample Page

a. In the Word Press Dashboard Select,

b. Pages => All Pages

c. Click on the Sample page checkbox and click Trash link

d. You will see that the Sample page is gone.

e. We can also rearrange the menu items in any order we like e.g.

Make the Contact Page last, and How to Create a web site after the About Us

Go to Appearance => Menus

Click { Delete Menus } - to delete all other previous menu

Then create a new menu e.g. Main Menu

Then, under Pages on the Left - select the first menu item and click { Add to Menu }

Repeat for second, third and subsequent menu items

Then click on the { Save Menu } button

Now, go to { Manage Locations } tab

Select { Header Menu } as { Main Menu }

Click { Save Changes }

You can also Drag the Menu Item rectangles with the various menu options so they appear in the order from top down that you want. Do not forget to click the { Save Menu } after dragging or re-arranging the menu items.

Note you can add submenus by dragging the new menus under the main menus but slightly off to the right – these will become drop downs.

How to customize the Home Page?

a. Return to the WP Dashboard select Appearance => Theme Options => click Home Page item.


b. Select the Headline type in “Finally, Free!”

c. In the Sub headline type “How to Create Websites”

d. In the Content area type in some text e.g. Learn how to create web sites…….

e. On Call to Action URL we will make it go to the video page: http://yourdomain.com/wp/how-to-create-a-web-page/ or any page URL you want

6. On Call to Action text type in “Learn Free Now” => Save Options and view Home Page How to change the Image on the Front Page?


b. Media => Add New c. Select an Image file and upload d. for the front page the image should be about 440 x 300 pixels at 72 dpi e. You can select Edit the image if you need to resize etc after uploading f. When you are done editing the image – Select Save all changes.

g. Select the File URL and copy it e.g. http://localhost/wp/wp-content/uploads/2014/09/0.jpg

h. Go to Appearance => Theme Options > Select the Home Page

i. Place your cursor inside the Featured Content box area and j. We have to write a little bit of code here e.g. <img src="http://localhost/wp/wp-content/uploads/2014/09/0.jpg" /> k. Then select Save Options at the bottom.


How to Modify Widgets on the Home Page?


b. Appearance => Widgets

c. Locate Home Widget 1, Home Widget 2 and Home Widget 3

d. Expand the Home Widget 1 and Drag the Text widget overtop (The Home Widget 1 must be expanded).

e. In the Title type in some Text and also type in some text in the main content area and


f. Click on the blue Save button at the bottom. g. Return to your web site and preview the update. h. Repeat for the other two boxes. i. You can also replace some of the widgets with other widgets example the Calendar widget – drag and drop. j. However, these default widgets do not have the normal text editor so we will download a plug in that gives us more control over the text we add i.e. a visual editor

How to Download and Install a Plugin for a Visual Editor? a. In the Dashboard select b. Plugins => Add New => Search Term => Black c. Normally you would search for Text editor but Black is the editor used in this tutorial d. Locate : Black Studio TinyMCE Widget e. This plugin adds a WYSIWYG text widget based on the standard TinyMCE WordPress visual editor. f. This is intended to overcome the limitations of the default WordPress text widget, so that you can visually add rich text contents to your sidebars, with no knowledge of HTML required. Features Add rich text widgets to your sidebar using visual editor Switch between Visual mode and HTML mode g. Click on the Install Now link then activate the plugin

h. Get back to Appearance =>Widgets

i. Open the Home widget 1 box so you can see the drop down

j. Drag the Black Studio TinyMCE widget down over the open Home Widget 1 box and drop it – k. you should see a full text editor open.

l. In the Title type: “Connect with me”

m. In the Textbox add some text “Subscribe to me on Youtube”.

n. We can also add images to the text box – we will go and get an icon and insert it. o. Go to a web site with free icons. p. Go to URL www.dryicons.com and click on free icons => 3 page => Handy Icon set => View download => Download PNG at the top and save to your desktop and unzip if necessary. q. Go back to the Dashboard – your cursor should be in the textbox Black Studio MCE and click on the top

camera icon next to Upload/Inster to insert image. Then click on Select files button => navigate to the

image files you downloaded select the 48 x 48 size folder and select the heart.png icon.

r. Select align image left in the radio button and then click on Insert into Post button at the bottom. s. Then Save the Widget

t. Next we will add an icon to Widget 2 - Drag the Black Studio TinyMCE box to the open Widget 2. u. In the Title call it “Learn” , in the textbox type “Jump to our how to videos to watch our video on how to


build a Wordpress web site from scratch.” v. Put the cursor in the box below the text, click on the insert image icon (camera) – this will take you to the Add Media window, click on the Select files button and add a monitor icon. Select align left, full size and then w. Click the Insert into Post button – then Save and collapse the Widget 2 Window. View the website. If all is OK – repeat and add some text and an icon to Home Widget 3. x. Widget 3 - Title Contact Me, text If you have any questions feel free to contact me by email, then insert an icon of a person. Then view the Home Page. y. Go back to Widget 3 – and lets make the contact me a hyperlink to the contact page. Open the widget and in the editor click and drag over the text “Contact me”, click the link button above then in the Insert URL box that appears Click on “Or link to existing content” and select the Contact Us page and click on the Add Link button. After adding the link be sure to Save to update the page. For more options click on the button on the top right – Show Hide Kitchen sink, this will bring up another row of buttons you can use to format the text, add custom characters etc. How to change and add a custom Logo to your web site? a. Dashboard => Media => Add New

b. Select files => Upload your logo (PNG)

c. Edit the image => Scale to 300 x 100 pixels,

d. You may also have to crop the image. This is the dimension it expect. Save the image.

e. Then click on the button “Save all changes”.

f. Click on the sa_logo link above the PNG – view the File URL – copy it,

g. Open a new browser window, paste in the File URL so its displayed in the browser

window, then right click on it and save it to the desktop.

h. Go to Dashboard => Appearance => Theme Options => Logo Upload i. Choose file>upload => Crop and Publish => Visit the Site and see your new Logo

How to Control the Side Bar Area of your Word Press web site? If you want to remove Recent post and add alternative boxes: a. Go to the Dashboard => Appearance =>Widgets and view the Main Sidebar where the widgets are.

b. Click and drag the side bar widget out of the Main sidebar window – drop them over Available widgets window just leave the Search box. Then view your web site, refresh the page if necessary and you should only see the search box.

c. Suppose, we are going to add a Youtube subscribe box – Go to Plugins => Add New => In the Search Term type in “Youtube Subscribe” click Search Plugins – when you find the plugin (should be at the top of the list) Install Now and Activate the Plugin

d. Return to the Appearance => Widgets page and you should see a new Youtube widget near the bottom right. Drag it up under the search widget on the right side and type in height 105 and width 250 and type in your user name – if not make one up for now and Save. Go back to the web site, refresh and view the new plugin.

Posts: In case you want to add a blog to your website, you can use different categories and posts. Let’s say you want to create a category named “blog”. To do so, simply add it to your menu and start making posts. Here’s what you need to do - on Dashboard:


a) Create a new category by going to “Posts => Categories”

b) Create a blog post by going to “Posts => Add New”. Once you blog post is ready, you need to add the right category for it.

c) Add a new category to the menu

Tweaking your website (Widgets, comments & just some “stuff” you need to know) Under this paragraph I’ll cover some of the basics things that might help you to tweak your website. Changing website title & tagline: In order to change title and tagline, go to “Settings => General” and simply fill in the forms.

Disabling comments under Posts & Pages: Some websites (business/organization sites mostly) don’t need any comments from visitors. While you are writing a new page, on the Dashboard, click “Screen options” (top right) and then tick “Discussion”. The “Allow Comments” box will appear at the bottom and all you need to do is untick “Allow comments”. In case you want to turn off comments on every new page by default, go to “Settings -> Discussion” and untick those options:

Static front-page: In case you want your site to have a static front page, on Dashboard, go to “Settings => Reading” and pick a static page for your website. Otherwise Word Press will take your latest posts and start showing them on your homepage.

Forum: Interested in starting a forum on your site? Look for the plug-in named “bbPress” and follow their tutorials.


Word Press Caching Plug-in - W3 Total Cache (W3TC):

What Is Caching?

Caching is a collection of methods that speed up the loading of your site. What it basically does is make a static copy of your dynamic site to reduce server rendering times. The same goes for your database and compiled PHP code. This is all saved in a type of image, which is served every time the site is visited. When changes are made, this copy is stored in the server’s memory.

We all know web page speed is important. When properly set up, a good Word Press caching plug-in can literally make your site fly, and allows for thousands of visitors per day without any problem.

We will discuss about W3 Total Cache (W3TC) plug-in which cuts the load time in half while it also reduces the total page size slightly. It allows for improved browser caching, and minifies all of your .js and .css files to a minimum size.

How to Install W3 Total Cache

• Go to the Plug-in section in your Word Press dashboard and click on Add New. • Then in the search box type “W3 Total Cache” and click on Search plug-in. • Click Install Now on the first result and activate the plug-in.


To check your site speed, go to Google Page Speed e.g. https://developers.google.com/speed/pagespeed/insights/ Type in your URL and click on Analyse. Now you’ll see your score out of 100 before W3 Total Cache setting on your site.

After installing W3 Total Cache, you’ll see Performance tab added on the left-hand menu of your Word Press dashboard. Click it to open the W3 Total Cache Settings.

It has a lot of options that might confuse you. And, if not configured properly can even stop your site from working properly. So follow the steps below carefully for successful W3 Total Cache settings

General Settings

From here you can choose whether to enable caching or not. First we’ll configure all the settings and then at the end, click on Preview to test them on the site. If everything’s fine, we’ll hit the Deploy button to make the settings live! So for now, leave it untouched

Page Cache

Enabling page cache decreases the load time of site as it decreases the server load. So click on Enable and choose Disk: Enhanced in Page Cache Method.

Minify

Minify reduces the size of your CSS and HTML files by removing line breaks, spaces and comments from the CSS files, thus delivering them faster. You just have to choose Enable against Minify and leave the rest as default.


Database Cache

Word Press works by sending multiple queries to your database and thus sometimes too many queries break down your server. To prevent this, enable Database Cache which saves the result of database queries preventing Word Press from looking into the database every time.

Keep Database Cache Method to Disk, as in the screenshot.

Object Cache

Object Cache may or may not effect your page speed. So first enable it, check your page speed and then disable it and again check your page speed to find the difference. If there is no difference, better disable it.


Browser Cache

Browser Cache tells your Visitor’s Browser how long to store a particular object. Some things like images are not changed from a post frequently and so the cache can just keep the file and not download it again and again, thus saving resources & time. So Enable it.

CDN

CDN or Content Delivery Network hosts static parts of your website on servers around the world. Thus when a visitor opens your page, he gets the static parts from a host nearby, thus decrease your server load and reducing latency. Enable if you have purchased a CDN and choose your CDN type accordingly.

Now all other settings like Miscellaneous settings, etc. are plug and play. Try different setting and check the difference in your page speed & enable them accordingly. These things are site-specific, you may need some & you may not need others.

Page Cache Settings

Click on Page Cache on the menu bar at the top to open up the specific settings that tell how Page Cache should operate.


General

Check out the screen shot to know the recommended settings.

Advanced, Cache Preload, Purge Policy

You can leave all these options default but if you want, you can play with them and check the difference in page speed for optimum W3 Total Cache settings.

Minify Settings (under performance on left panel)

General

Tick both Rewrite URL structure and disable minify for logged in users. The latter is a personal choice though.


Minify :: HTML & XML

Click on Enable HTML minify settings and then enable all the options except Don’t minify feeds, as in the screenshot.

JS

Enable it but if on deploying these settings you find any problem in your site then you can disable this. Also, you can keep other check boxes unchecked.

CSS

Set it up as shown in the screen shot for best performance.


Database Cache Settings

In general settings click on the check box against Don’t cache queries for logged in users and leave the Advanced Settings as default.

Object Cache Settings

You can leave this as default or play with it and compare your page speeds for best W3 Total Cache settings.

Browser Cache Settings

See the screen shot to know the recommended general settings. Leave other settings as default.


Now, you have completed W3 Total Cache settings. Go back to General Settings of W3 Total Cache & hit the Preview mode Enable button to preview the changes on your site. If everything is fine, click the Deploy button to make these settings live.

Now, you can check the difference in your page speed to know how important W3 Total Cache is.


SEO Plug-in

You do not need to use all available SEO plug-in but I would suggest pick the one which suits your need. Every WP plug-in works in a different way and you can select the one which works the best for you.

Here, I have mentioned some SEO plug-in, depending upon your need, you can select one. Though, some of the premium plug-in have advantage over many other like EasyWPSEO is way better for Keyword optimization than Yoast Word Press SEO plug-in.

SEO plug-in: Yoast Word Press SEO Plug-in, Social SEO Pro, Broken link checker, SEO smart link Word Press plug-in, SEO friendly Images etc.

We will discuss here about the most used SEO Plug-in for Word Press Blogs:

Yoast Word Press SEO Plug-in:

This is the first and best free SEO plug-in for Word Press. This single plug-in takes care of many aspect of your Word Press blog SEO. Using SEO by yoast you can do following things:

Add meta value for homepage Add Meta value for Single post Social SEO Create Sitemap file Edit robots.txt and .htaccess Control indexing of your blog

A Guide for configuring Word Press Yoast SEO plug-in

Word Press SEO by yoast is powerhouse for Word Press search engine optimization. Though, setting up this plug-in might be tricky and a new blogger or one without basic SEO skills, might find it hard to configure. A wrong configuration, can stop search engine bots from indexing your blog or you might let bots crawl part which might not be important. Anyways, before we go ahead with our setup guide, lets look into some of the SEO features offered by this plug-in:

Verify site in Google, Bing and Alexa Title meta settings Hide RSD, WLW, Short links from head Meta control for Taxonomies, author page Supports Face book Open graph Generate sitemap Advance perma-link control Breadcrumbs support RSS feed footer plug-in settings Import settings from other SEO plug-in. Edit .htaccess files Hide date from Search engine snippets Add Google authorship for single author


Above, are some of the settings offered by this plug-in and now, let’s get started with setting up this free SEO plug-in.

If you are using any existing SEO plug-in like All in one SEO, Old all in one SEO, headspace 2 or

using any other plug-in by Yoast like RSS footer, Robots meta or Yoast breadcrumbs, you should start by

importing settings to this plug-in. Once you have installed and activated Word Press SEO by yoast, go to

SEO> Import & export under left panel and select the plug-in from which you would like to import

your settings. I suggest to take a back up of your database and then use option which says ”Delete the

old data after import? (recommended)“.


Now, very first step to get started with this plug-in is by submitting your site to Google, Bing, Alexa, Pinterest and Yandex. Submitting the site - is not covered within this tutorial. Now, lets get started with advance part of this plug-in:

Titles and Meta Settings:

This is one of the most important part of this plug-in and I will explain most of the part with screenshots and brief explanation below it. Once you click on Titles and metas, click on help section first to see what operator is being used and what does they do. This will help you to quickly setup title and metas SEO part.


You can ignore “use meta keyword tag”, as Google already made it official that they do not care about Keyword meta tag. Last options will keep your WordPress blog head section clean by hiding information such as, post shortlinks, WLW manifest link and other. Now, click on home tab and configure the settings for your homepage title and meta description. Here is a screenshot


Title template : Home title that you want to show in Google search.

Meta description: Your Homepage meta description for search engine.

Meta Keyword template : Add your target keyword for homepage

Author Metadata: Select the author which you want to use for Google authorship. Also

click on Edit profile and add your Google plus profile link in the Google + field.

Ex: https://plus.google.com/117420368760274729369/ . Also add your Website link in

Contributor section of Google plus profile.

Google publisher page: Add your Google plus page URL here and add your Website link

in your page about section.

Now, click on home tab and configure the settings

Here you can define the SEO for post, page and media section of your Word Press blog. As I mentioned above, do check out help section to understand what templates you can use. Also, by default Word Press SEO by yoast, hides the date from search engine snippets, which is useful for blog writing evergreen content. If you are running news blog, and want to show date for your posts in search engine, you can check “Date in snippet preview” box.


For Taxonomies, - it would be better keeping tags and categories as noindex and dofollow. Though, it may change depending upon your Blog SEO plan. If you wish to use the recommended settings, simply check “Noindex, follow” and “hide” box. You can again configure title template according to your wish. Since we are not indexing tags and categories, you can add more user and brand centric title template. e.g.: “%%term_title%% Archives %%page%% %%sep%% %%sitename%%”

For other option, you can set indexing for your author and date based archive. Also you can disable or enable date and author archive. It is suggested to check “Noindex and follow” box and leave everything as it is.

So, that finishes our setting part for meta and titles settings of Word Press SEO by yoast.

Now, go to the option for Social Settings. Here you can configure the Facebook open graph meta tags, default image for Facebook and twitter meta card. It is recommend you to add a default image, which will help Facebook to show an image, when your posts have no image and is liked or shared on Facebook.

For XML Sitemap option - simply enable the sitemap and select what all part you wish to add or remove from your sitemap.

For Permalink Configuration - Don’t confuse this with Word Press default Permalink setting. Here you can configure advanced permalink settings. Normally, use 2-3 settings from here to avoid parameters being indexed in Google search. Specially with this plug-in, it’s easier to get rid of replytocom parameter, which is quite a headache at time. Here is a screenshot of recommended settings:


For Internal Link option - Breadcrumbs are useful for making search engine understand your site structure and helps users in navigating your site. Once you are done making all the changes in SEO by yoast plugin, go ahead and use Google rich snippet testing tool to check for authorship and see how Google will show your blog post in Google search.

For RSS option - this part integrates the feature of RSS footer plug-in and using it, you can add a link back to original article in RSS feeds. You can also use it to add advertisement on your RSS feeds. You can simply add following line in after post content section “The post %%POSTLINK%% appeared first on %%BLOGLINK%%.”

For Edit Files option - This is another useful feature of Word Press SEO by yoast plugin. You can edit Word Press .htaccess and robots.txt file from dashboard. A word of caution: When ever you are editing your .htaccess file from dashboard, always keep FTP access too, as mis-configured .htaccess file may stop your site to stop functioning.

Redirects:

This is another handy feature of this plug-in, as it lets you direct any URL to URL of your choice. Specially when you are getting too many 404 errors (You can check that in Google Webmaster tool), you can simply re-direct them to save your link juice.


Webmaster tools:

It is important for you to submit your blog to Google Webmaster tools, and at the same time you should monitor all the crawl errors. This way you would know, what errors they are getting while trying to crawl and index your blog. With SEO by Yoast Webmaster tool, you can see all errors inside your Word Press dashboard. For the first time you need to add the authentication code (This is simple step) and after that you can see all errors within your dashboard.

In the end: It is highly recommend you to be sure of setting before making any changes. A wrong configuration may bring negative SEO effect on your Blog.


APPENDIX

1. Protect Your WordPress Admin Area

You can use .htaccess to protect your WordPress admin area by limiting the access to selected IP addresses only. Simply copy and paste this code into your .htaccess file:

AuthUserFile /dev/null AuthGroupFile /dev/null AuthName "WordPress Admin Access Control" AuthType Basic <LIMIT GET>

order deny,allow deny from all # whitelist Syed's IP address allow from xx.xx.xx.xxx # whitelist David's IP address allow from xx.xx.xx.xxx # whitelist Amanda's IP address allow from xx.xx.xx.xxx # whitelist Muhammad's IP address allow from xx.xx.xx.xxx # whitelist Work IP address allow from xx.xx.xx.xxx

</LIMIT>

Replace xx.xx.xx.xxx with your own IP addresses. If you use more than one IP address to access the internet, then make sure you add them as well.

2. Password Protect WordPress Admin Folder


First you need to create a .htpasswds file. You can easily create one by using online generator available on Internet.

Upload this .htpasswds file outside your publicly accessible web directory or /public_html/ folder. A good path would be: home/user/.htpasswds/public_html/wp-admin/passwd/

Now you need to create a new .htaccess file and add this code:

AuthName "Admins Only" AuthUserFile /home/yourdirectory/.htpasswds/public_html/wp-admin/passwd AuthGroupFile /dev/null AuthType basic require user putyourusernamehere <Files admin-ajax.php>

Order allow,deny Allow from all Satisfy any

</Files>

Important: Don’t forget to replace AuthUserFile path with the file path of your .htpasswds file and add your own username.

Upload this .htaccess file to your wp-admin folder. That’s all, your WordPress admin folder is now password protected and only you or the users you allow will be able to access it.

3. Disable Directory Browsing in WordPress

Many WordPress security experts recommend disabling directory browsing. With directory browsing enabled, hackers can look into your site’s directory and file structure to find a vulnerable file.

To disable directory browsing in WordPress all you need to do is add this single line in your .htaccess file: Options -Indexes

4. Disable PHP Execution in Some WordPress Directories

Sometimes hacked WordPress sites usually have backdoor files. These backdoor files are often disguised as core WordPress files and are placed in /wp-includes/ or /wp-content/uploads/ folders. An easier way to improve your WordPress security is by disabling PHP execution for some WordPress directories.


Create a blank .htaccess file and paste this code inside it:

<Files *.php> deny from all

</Files>

Now upload this file to your /wp-content/uploads/ and /wp-includes/ directories.

5. Protect Your WordPress Configuration wp-config.php File

Probably the most important file in your WordPress website’s root directory is wp-config.php file. It contains information about your WordPress database and how to connect to it. To protect your wp-config.php file from unathorized access, simply add this code to your .htaccess file:

<files wp-config.php> order allow,deny deny from all

</files>

6. Setting up 301 Redirects Through .htaccess File

Using 301 redirects is the most SEO friendly way to tell your users that a content has moved to a new location.

If you just quickly want to redirect users from one URL to another, then all you need to do is paste this code in your .htaccess file

Redirect 301 /oldurl/ http://www.example.com/newurl Redirect 301 /category/television/ http://www.example.com/category/tv/

7. Ban Suspicious IP Addresses

Seeing unusual requests from an IP address? Want to block an IP address from accessing your website? Add this code to your .htaccess file:

<Limit GET POST> order allow,deny deny from xxx.xxx.xx.x allow from all

</Limit>

Replace xxx with the IP address you want to block.

8. Disable Image Hotlinking in WordPress Using .htaccess

Other people can slow down your website and steal your bandwidth by hotlinking images from your website. Normally, this doesn’t concern most users. However, if you run a popular site with lots of images and photos, then hotlinking can become a serious issue. You can prevent image hotlinking by adding this code in your .htaccess file:


#disable hotlinking of images with forbidden or custom image option RewriteEngine on RewriteCond %{HTTP_REFERER} !^$ RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?wpbeginner.com [NC] RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC] RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feeds2.feedburner.com/wpbeginner [NC] RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]

Don’t forget to replace wpbeginner.com with your own domain name.

9. Protect .htaccess From Unauthorized Access

As you have seen that there are so many things that can be done using .htaccess file. Due to the power and control it has on your web server, it is important that you protect it from unauthorized access by hackers. Simply add this code to your .htaccess file:

<files ~ "^.*\.([Hh][Tt][Aa])"> order allow,deny deny from all satisfy all

</files>

Why You Are not Getting Emails from Your WordPress Site

The most common reason for this is that your WordPress hosting server is not configured to use PHP mail() function.

Another reason is that many email service providers use a variety of tools to reduce email spam. These tools often try to detect that an email is originating from the location it claims to be originating from. Sometimes the email is sent out by WordPress, but it never even makes into spam folder of the destination. This is why we recommend not using WordPress to send your email newsletter.

Sending Your WordPress Emails Using Mandrill

Mandrill is an email delivery system brought to you by the folks behind the popular MailChimp email service provider. Mandrill is a dedicated email service provider, so they spend a lot of money and time on making sure that your email reaches its destination. Using Mandrill, you can send your emails using Mandrill’s servers located all over the world.

Mandrill is free to use for sending up to 12,000 emails per month. This is quite sufficient if you run a small blog.

Configuring Mandrill with WordPress is super easy. First you need to install and activate the wpMandrill plugin. Upon activation, go to Settings » Mandrill to configure the plugin. You will be asked to provide your Mandrill API Key.


To obtain your API key, visit Mandrill website and sign up for your free account. After logging into your Mandrill Dashboard, you need to go to Settings page and click on the + New API Key button.

Mandrill will create an API key for you. Copy and paste this API key on the plugin’s settings page under your WordPress admin area.

After entering your API key, Mandrill will ask you to provide sender name and a valid sender email address. Click on save changes button after entering this information.


That’s all, your WordPress website is now configured to use Mandrill for all outgoing email.

Sending WordPress Email Using Gmail SMTP Servers

Another alternative to send your WordPress emails is using Gmail SMTP servers. You can use any regular Gmail account with this method to send out your emails. However, your email deliverability will be much better if you are using Google Apps on that particular domain name.

Most email service providers check whether or not an email is originating from the same location it claims to be originating from. When you are using a regular Gmail account, those emails are not originating from gmail servers, and this may affect their deliverability.

To use Gmail SMTP Servers for your WordPress emails, simply install and activate the WP Mail SMTP plugin. Upon activation, go to Settings » Email to configure the plugin.


First you need to provide a sender email address and name. This should be a valid email address configured to be used with Google Apps. Make sure that ‘Send all WordPress emails via SMTP’ option is checked.

After that you need to provide your Gmail SMTP server address, port, and login credentials.

That’s all, save your changes and use the test email form at the bottom of settings page to test your email settings.

How to Add Custom Styles to WordPress Visual Editor?

WordPress visual editor comes with basic formatting options. However, sometimes you may need custom styles of your own to add CSS buttons, content blocks, taglines, etc. Switching from Visual to Text editor and adding CSS each time is time-consuming. What if we told you that you can add formatting options as custom styles in your WordPress visual editor? In this article, we will show you how to add custom styles to WordPress visual editor.

Note: This tutorial requires basic working knowledge of CSS.


Manually Adding Custom Styles to WordPress Visual Editor

We are going to start with adding your own custom styles and formatting options in WordPress visual editor without installing any new plugin.

Since you will be editing your theme files, please make a backup of your theme.

For the sake of this tutorial, we will be adding a custom style to add a content block and a custom CSS button in the post.

First thing we need to do is add a custom styles drop down menu in the WordPress visual editor.

Simply copy and paste the following code in your theme’s functions.php file or a site-specific plugin.

function wpb_mce_buttons_2($buttons) { array_unshift($buttons, 'styleselect'); return $buttons; } add_filter('mce_buttons_2', 'wpb_mce_buttons_2');

This code will add a style select drop down menu on the second row of the buttons. You will need to click on the kitchen sink button to see it.

After adding a drop down menu for your custom styles, the next step is to fill it up with options. Simply copy and paste this code in your functions.php file or in a site-specific plugin.

/* * Callback function to filter the MCE settings */ function my_mce_before_init_insert_formats( $init_array ) { // Define the style_formats array $style_formats = array(


// Each array child is a format with it's own settings array( 'title' => 'Content Block', 'block' => 'span', 'classes' => 'content-block', 'wrapper' => true, ), array( 'title' => 'Blue Button', 'block' => 'span', 'classes' => 'blue-button', 'wrapper' => true, ), array( 'title' => 'Red Button', 'block' => 'span', 'classes' => 'red-button', 'wrapper' => true, ), ); // Insert the array, JSON ENCODED, into 'style_formats' $init_array['style_formats'] = json_encode( $style_formats ); return $init_array; } // Attach callback to 'tiny_mce_before_init' add_filter( 'tiny_mce_before_init', 'my_mce_before_init_insert_formats' );

In this code we have added three options to the drop down menu. A content block, a blue button, and a red button.

If you study this code, you will notice that each style format has title, block, classes, and wrapper. The title is what you will see in the TinyMCE drop down menu in your visual editor.

The block is the name of the block element to produce on the selected text. We have used span, you can use any other element you want. The classes will add the CSS class to the element, so that you can style it accordingly.

After adding this code, you can go to the post editor where you will see your new drop down menu with these options. However, selecting these options will not make any change just yet. You need to add CSS rules to your theme’s style sheets.

Here is the CSS code that we have used for the tutorial.

.content-block { border:1px solid #eee; padding:3px; background:#ccc; max-width:250px; float:right; text-align:center;


} .content-block:after { clear:both; } .blue-button { background-color:#33bdef; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; border:1px solid #057fd0; display:inline-block; cursor:pointer; color:#ffffff; padding:6px 24px; text-decoration:none; } .red-button { background-color:#bc3315; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; border:1px solid #942911; display:inline-block; cursor:pointer; color:#ffffff; padding:6px 24px; text-decoration:none; }

Copy and paste this CSS into your theme or child theme’s style sheet and editor-style.css file. The editor style sheet controls the appearance of your content in the visual editor. Check your theme’s documentation to find out the location of this file.

If your theme doesn’t have an editor style sheet file, then you can always create one. Simply create a new CSS file and name it custom-editor-style.css. Upload this file to your theme’s root directory and then add this code in your theme’s functions.php file.

function my_theme_add_editor_styles() { add_editor_style( 'custom-editor-style.css' ); } add_action( 'init', 'my_theme_add_editor_styles' );

That’s all. You have successfully added your custom styles into WordPress visual editor. Feel free to play around with the code by adding your own elements and styles.

Using a Plugin to Add Custom Styles in WordPress Visual Editor

This method does exactly what we have shown you above, but it provides a web based interface, so that you don’t have to manually edit the files yourself.


First thing you need to do is install and activate the TinyMCE Advanced Professional Formats and Styles plugin. Upon installation, go to Settings » TinyMCE prof. Styles to configure the plugin.

The plugin allows you to choose the location of style sheet files. It can use your theme or child theme’s style sheets, or you can choose a custom location of your own. After that you need to click on the Save Settings button to store your changes.

To add a new style option, you can to scroll down to style section and click on the Add new style button.

First enter a title for the style. This title will be displayed in the drop down menu. Then choose whether it is an inline, block, or selector element. After that add a CSS class and then add your CSS rules as shown in the screenshot below.

Once you have added a CSS style, simply click on the Save Settings button to store your changes.

To see your custom styles in action, edit an existing post or create a new one. You will see a Format drop down menu in the second row of Word Press visual editor.


We hope this article helped you add custom styles to Word Press visual editor. Feel free to create as many styles you want and simply apply them with a few clicks.

How to Add a Contact Form Popup in Word Press?

This is a common trend on many sites where when a user clicks on the contact button or link, instead of going to a new page, the contact form opens in a popup. In this article, we will show you how to add a contact form popup in Word Press that will work for just about any contact form plug-in. We will also show you how to only open the popup when a user clicks on link or button to ensure the best user experience.


Getting Started

For this tutorial, you will need to install and activate two plugins:

First, you need OptinMonster with the Canvas Add-on. OptinMonster is the best Word Press popup and lead generation plugin.

Disclaimer: OptinMonster is created by WPBeginner’s founder, Syed Balkhi.

Next, you will need to have a contact form plugin such as Gravity Forms, Contact Form 7, Ninja Forms, etc.

For the sake of this article, we will be using our favourite contact form plugin: Gravity Forms

Let’s get on with creating a contact form popup in Word Press.

Step 1: Creating a Word Press Popup using OptinMonster

First thing we need to do is create a modal popup using OptinMonster.


You need to create a new optin by clicking on OptinMonster in WordPress admin menu, and then click on Create New Optin button.

On the Setup tab, you need to choose Canvas Popup as your optin type and then click on the Next Step button. If you don’t see Canvas, then it means that you don’t have that addon installed. Please install it using the addon screen.

Once you select Canvas, it will bring you to a configuration screen. You need to give this popup a title which will only be used internally and will help you identify this particular popup.


After that you can enter a value for optin loading delay. If you want the popup to load when user clicks a link or to load using exit intent, then leave the delay time to 0.

Optin cookie duration is set to 7 days by default. This means that once a user sees the canvas popup optin and decides to close it, then they will not see it for next 7 days. Because we’re going to use the click method, you should set the cookie duration to 0 as well.

Once you are satisfied with the configuration settings, click on Save and Design Optin button to proceed to next step.

On the design tab, first you need to click and choose your optin theme. At the time of writing this article, there is only one White Board theme available for the canvas popup. You need to select it and then click on the Design Customizer button.


The design customizer screen is divided in two panes. On your right, you will see a preview of your lightbox popup and on your left you will see sections like Dimensions, HTML, CSS, and Effects (effects will only appear if you have the effects addon installed).

By default, the dimensions for your canvas popup are set to 700 x 300px. You can change them to meet your needs.

You will notice that Canvas is blank by design. It’s done that way, so you can add just about anything you want while using the power of OptinMonster. You can add a signup form, facebook like box, surveys, coupon codes, or like we’re doing in this example a contact form.

Now that you have chosen your dimensions, let’s add our contact form inside it.


Start by clicking on the HTML tab to expand it. This is where you will paste the HTML code, or your shortcodes.

Here is a sample HTML we used to create the modal popup shown in the screenshot above. <h3>Do You Have Any Questions?</h3> <p>Want to ask us more about our services? Simply fill out this form and we will answer quickly. Alternatively, you can also call us at 5555-5555.</p> [gravityform id="4" name="CanvasPopupForm" title="false" description="false"]

Notice that we have embedded a Gravity Form shortcode in there as well. If you are using another contact form, then simply replace the shortcode with your contact form shortcode.

Once you have entered the required HTML, click on the CSS tab to add styling to your modal popup.

Each of your CSS rule is required to use the prefix given just above the CSS box.

Here is the CSS we used to create the modal popup shown in the screenshot above.

html div#om-lku3gv5wny-canvas #om-canvas-whiteboard-theme-optin-wrap { background:#fff; border:10px solid #F5F5F5; color:111; } html div#om-lku3gv5wny-canvas .gfield { list-style:none; } html div#om-lku3gv5wny-canvas input[type=text]{ width:420px; } html div#om-lku3gv5wny-canvas input[type=submit] { background:#ff6600;


color:#FFFFFF; padding:5px; width:420px; margin-left:40px; } html div#om-lku3gv5wny-canvas textarea { height:80px; width:420px; }

Depending on what you are adding in your popup, you can use Google Chrome’s Inspector tool to find out which CSS classes or elements you need to edit.

Once you are done editing the popup styling, click on the Save button on top of the customizer and hit close to exit.

You will be back at the design tab, so you need to click on the Manage Output Settings button to finalize your settings.

The output settings screen is where you configure the optin’s output option. All you need to do here is check Enable optin on site. We will cover how to open popup with a link in the next step.

If you want the popup to load automatically based on timer or exit-intent, then you can load optin globally or use other conditionals accordingly.


Save your settings when you are done.

Step 2: Open Contact Form Popup with a Link

Launching a popup with a link is really simple thanks to the MonsterLink functionality that OptinMonster has. Each popup has a unique ID to identify it. You can find your canvas popup’s unique slug by going to the optin screen and clicking on the gear icon next to the canvas popup you just created.

Now you will need to use this unique optin slug to create a link, like this:


<a href="#" class="manual-optin-trigger" data-optin-slug="lku3gv5wny-canvas">Click me!</a>

You can use this link in your WordPress posts, pages, widgets, and even your templates. Clicking on the link will open your contact form in a popup window.

Word Press Vulnerability and how to fix them

Vulnerability # 1: SQL Injection & URL Hacking.

Problem:

Word Press is a database-backed platform that executes server-side scripts in PHP. Both of these characteristic can make Word Press vulnerable to malicious URL insertion attacks. Commands are sent to Word Press via URL parameters, which can be abused by hackers who know how to construct parameters that Word Press may misinterpret or act on without authorization.

SQL injection describes a class of these attacks in which hackers embed commands in a URL that trigger behaviours from the database. (SQL is the command language used by the MySQL database.) These attacks can reveal sensitive information about the database, potentially giving hackers entrance to modifying the actual content of your site. Many of today's web site defacement attacks are accomplished by some form of SQL Injection.

Other versions of URL hacks can trigger unintended PHP commands which, again, can lead to injecting malware or revealing sensitive information.

Solution:

Most Word Press installations are hosted on the popular Apache web server. Apache uses a file named .htaccess to define the access rules for your web site. A thorough set of rules can prevent many types of SQL Injection and URL hacks from being interpreted.

The code below represents a strong set of rules that you can insert into your web site's .htaccess file that will strip URL requests of many dangerous attack injections:

<IfModule mod_rewrite.c>

RewriteEngine On

RewriteBase /

RewriteCond %{REQUEST_METHOD} ^(HEAD|TRACE|DELETE|TRACK) [NC]

RewriteRule ^(.*)$ - [F,L]

RewriteCond %{QUERY_STRING} \.\.\/ [NC,OR]

RewriteCond %{QUERY_STRING} boot\.ini [NC,OR]

RewriteCond %{QUERY_STRING} tag\= [NC,OR]

RewriteCond %{QUERY_STRING} ftp\: [NC,OR]

RewriteCond %{QUERY_STRING} http\: [NC,OR]

RewriteCond %{QUERY_STRING} https\: [NC,OR]

RewriteCond %{QUERY_STRING} (\<|%3C).*script.*(\>|%3E) [NC,OR]

RewriteCond %{QUERY_STRING} mosConfig_[a-zA-Z_]{1,21}(=|%3D) [NC,OR]

RewriteCond %{QUERY_STRING} base64_encode.*$.*$ [NC,OR]

RewriteCond %{QUERY_STRING} ^.*(\[|\]|$|$|<|>|ê|"|;|\?|\*|=$).* [NC,OR]

RewriteCond %{QUERY_STRING} ^.*("|'|<|>|\|{||).* [NC,OR]

RewriteCond %{QUERY_STRING} ^.*(%24&x).* [NC,OR]

RewriteCond %{QUERY_STRING} ^.*(%0|%A|%B|%C|%D|%E|%F|127\.0).* [NC,OR]

RewriteCond %{QUERY_STRING} ^.*(globals|encode|localhost|loopback).* [NC,OR]

RewriteCond %{QUERY_STRING} ^.*(request|select|insert|union|declare).* [NC]

RewriteCond %{HTTP_COOKIE} !^.*wordpress_logged_in_.*$

RewriteRule ^(.*)$ - [F,L]

</IfModule>


Vulnerability # 2: Access to Sensitive Files.

Problem:

A typical Word Press install contains a number of files which you don’t want outsiders to access. These files, such as the Word Press configuration file, install script, and even the “readme” file should be kept private.

Solution:

As with preventing URL hacking, you can add commands to the Apache .htaccess file to block access to sensitive private files. For a typical Word Press installation, the following code will block access to directory listings, plus a set of specific files related to WordPress and the Web server itself.

Options All -Indexes <files .htaccess> Order allow,deny Deny from all </files> <files readme.html> Order allow,deny Deny from all </files> <files license.txt> Order allow,deny Deny from all </files> <files install.php> Order allow,deny Deny from all </files> <files wp-config.php> Order allow,deny Deny from all </files> <files error_log> Order allow,deny Deny from all </files> <files fantastico_fileslist.txt> Order allow,deny Deny from all </files> <files fantversion.php> Order allow,deny Deny from all </files>


Vulnerability # 3: Default Admin User Account.

Problem:

Many default Word Press installs include an administrator user account whose username is simply “admin”. Hackers may try to log into this account using guessed passwords.

Solution:

Any element of predictability gives hackers an edge. Although a hacker would still need to guess or brute-force your password to access the admin account, you are even more secure without an “admin” account at all.

Instead, log into Word Press and create a new user with an unpredictable name. Assign administrator privileges to this user. Now delete the account named “admin”. A hacker would now need to guess both the username and password to gain administrator access, a significantly more challenging feat.

Vulnerability # 4: Default Prefix for Database Tables

Problem:

The Word Press database consists of numerous tables. In many Word Press installs, these tables are named with a default prefix that begins with “wp_“. For hackers, the ability to predict anything can provide an extra advantage.

Solution:

Changing the prefix of your Word Press tables can eliminate this predictability. Some security experts argue that this will not stop a savvy hacker who can use other means to determine the table names in your installation. While this is true when talking about a knowledgeable hacker, many amateur hackers use pre-packaged scripts to perform their dirty work and these are more likely to be successfully blocked by eliminating predictable table names.

When setting up a new Word Press install, you can specify the database table prefix yourself. This gives you the opportunity to choose something unique and unpredictable. If Word Press is already installed, you can retroactively change the table names. Although this can be done manually, the process requires directly manipulating the database in several places.

An easier way to change table prefixes for an existing Word Press installation is by using the plug-in named Better WP Security. This plug-in contains several defences including some discussed elsewhere in this document, with a simple point-and-click interface to change your table names to include a randomly-generated prefix.

Vulnerability # 5: Brute-Force Login Attempts

Problem:

Hackers often rely on automated scripts to do their dirty work. These scripts can make numerous attempts to log into your Word Press administration page by trying thousands and millions of


combinations of usernames and passwords. Not only can being bombed with login attempts slow down your web site for legitimate users, it may also succeed—giving hackers complete control of your site.

Solution:

Of course, you should start with always using strong passwords. A longer, mixed-type password will take longer for a brute-force attack to decode. These attacks typically use combinations of dictionary words and numbers. (But remember that malware can render strong passwords useless.)

An even more effective defence is to install a login limiter for Word Press. A login limiter can essentially block or quarantine an IP address or username which tries and fails to send login requests above a threshold rate. For example, a login limit of 10 attempts per 5 minutes can be backed up with a penalty timeout of 1 hour.

A successful brute-force attack against a strong password effectively becomes impossible with these limits in place, because the hacker can never try enough variations (or rather, it would take many years of continuous attempts).

Two Word Press plug-in which let you enforce a login limiter are Limit Login Attempts and the aforementioned Better WP Security.

These five strategies are the beginning of effective Word Press security—not the end. Like any form of security, defending Word Press is an ongoing process that must involve awareness of new threats combined with specific details about your own install environment.

Word Press Page rendering Speed issues and how to fix them

You’ve probably heard this before, but when a person lands on your site for the first time, you only have a few seconds to capture their attention to convince them to hang around.

If you’ve been doing this online business thing for a while, you’ll recognize the importance of branding, a nice layout, putting important things above the fold, and all of that good stuff in order to try to capture visitors into staying.

But if your page loads slowly, you may lose people before you even have the change to convert them.

Most studies have confirmed that you have a very short time to load your site before people click away, especially if they’ve been linked there from another site that they visit.

Following are few suggestion using even a few of these will drastically speed up your site.

1. Choose a good host

While starting out, a shared host might seem like a bargain (“Unlimited page views, wowie zowie!”), it comes at another price: incredibly slow site speed and frequent down time during high traffic periods.

If you plan on doing awesome stuff (aka the kind of stuff that creates high traffic periods), you’re killing yourself by running your Word Press site on shared hosting.

The stress of your site going down after getting a big feature is enough to create a few early gray hairs: don’t be a victim, invest in proper hosting.


Last but not least, support is top notch, which is a must when it comes to hosting… take it from a guy who’s learned that the hard way!

Head on over to the WP Engine homepage and check out their offerings, you’ll be happy you did.

2. Start with a solid framework/theme

You might be surprised to here this, but the Twenty Ten/Twenty Eleven “framework” (aka the default WP themes) are quite speedy frameworks to use.

That’s because they keep it the “guts” simple, and light frameworks are always the way to go to have a speedy site.

From experience, the fastest loading premium framework is definitely the Thesis Theme Framework (aff).

Whatever you might say about it’s SEO abilities (Developers prefer to use plug-in and developers own edits), it is definitely a solid framework for quick page loads.

How to speed-up your Word Press Website

Below are some quick fixes that will dramatically improve your website’s loading time, including:

� identifying which plug-in are slowing down your website; � automatically compressing Web pages, images, JavaScript and CSS files; � keeping your website’s database clean; � setting up browser caching the right way.

Lay The Foundation

If it’s hosted on a sluggish server or has a bloated theme, quick fixes won’t help. You’ll need to fix the foundation.

So, let’s start with what makes for a good foundation and how to set ourselves up for a website that runs at lightening speed.

Choose A Good Host

If you want your website to run quickly, start with a good hosting company and package.

Choose A Good Theme

Unfortunately, not all Word Press themes are created equal. While some are extremely fast and well coded, others are bloated with hundreds of bells and whistles under the pretence of being “versatile and customizable.”

When you choose a theme, check the page speed of the theme’s demo, using a tool such as Pingdom, to see how quickly it runs with nothing added to it. This should give you an idea of how well coded it is.


Use A Content Delivery Network

A CDN hosts your files across a huge network of servers around the world. If a user from Argentina visits your website, then they would download files from the server closest to them geographically. Because your bandwidth is spread across so many different servers, the load on any single server is reduced.

Setting up a CDN can take a few hours, but it’s usually one of the quickest ways to dramatically improve page-loading speed.

A good way to start speeding up a website is to look at what can be removed. More often than not, a website is slow not because of what it lacks but because of what it already has.

1. Identify Plug-in That Are Slowing You Down

P3 is one of word press favourite diagnostic plug-in, - because it shows you the impact of your other plug-in on page-loading time. This makes it easy to spot any plug-in that are slowing down your website.

A common culprit is social-sharing plug-in, most of which bloat page-loading times and can easily be replaced by embedding social buttons into the theme’s source code.

Once you’re aware of which plug-in are slowing down your website, you can make an informed decision about whether to keep them, replace them or remove them entirely.

2. Compress Your Website

When you compress a file on your computer as a ZIP file, the total size of the file is reduced, making it both easier and faster to send to someone. Gzip works in exactly the same way but with your Web page files.

Once installed, Gzip automatically compresses your website’s files as ZIP files, saving bandwidth and speeding up page-loading times. When a user visits your website, their browser will automatically unzip


the files and show their contents. This method of transmitting content from the server to the browser is far more efficient and saves a lot of time.

There is virtually no downside to installing Gzip, and the increase in speed can be quite dramatic.

While some plug-in will add Gzip to your website with the click of a button, installing it manually is actually very simple. Open your .htaccess file (found in the root directory on your server), and add the following code to it:

AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript

Once you’ve added this snippet of code to .htaccess, test whether Gzip is working on your website by running Check Gzip Compression.

3. Compress Images

Images take up the majority of bandwidth on most websites. WP Smush.it is another great plug in that automatically compresses images as you upload them to the media library. All compression is “lossless,” meaning that you won’t notice any difference in the quality of images.

One nice thing about WP Smush.it is that it works retroactively. If thousands of images are saved in your media library, you can run them all through the plug-in, compressing them to a more manageable size.

4. Leverage Browser Caching

Browser caching is a tricky issue. A handful of great caching plug-in are available, but if set up incorrectly, they could cause more harm than good.


Expires headers tell the browser whether to request a particular file from the server or from the browser’s cache. Of course, this only works if the user already has a version of your Web page stored in their cache; so, the technique will speed up the website only for those who have already visited your website.

Expires headers speed up a website in two ways. First, they reduce the need for returning visitors to download the same files from your server twice. Secondly, they reduce the number of HTTP requests made.

To do this with a plug-in, I recommend using WP Super Cache. However, following an installation guide is strongly recommended to ensure that you set it up correctly. Alternatively, you could add expires headers by adding the following code to your .htaccess file.

# # associate .js with “text/javascript” type (if not present in mime.conf) # AddType text/javascript .js # # configure mod_expires # # URL: http://httpd.apache.org/docs/2.2/mod/mod_expires.html # ExpiresActive On ExpiresDefault “access plus 1 seconds” ExpiresByType image/x-icon “access plus 2692000 seconds” ExpiresByType image/jpeg “access plus 2692000 seconds” ExpiresByType image/png “access plus 2692000 seconds” ExpiresByType image/gif “access plus 2692000 seconds” ExpiresByType application/x-shockwave-flash “access plus 2692000 seconds” ExpiresByType text/css “access plus 2692000 seconds” ExpiresByType text/javascript “access plus 2692000 seconds” ExpiresByType application/x-javascript “access plus 2692000 seconds” ExpiresByType text/html “access plus 600 seconds” ExpiresByType application/xhtml+xml “access plus 600 seconds” # # configure mod_headers # # URL: http://httpd.apache.org/docs/2.2/mod/mod_headers.html # Header set Cache-Control “max-age=2692000, public” Header set Cache-Control “max-age=600, private, must-revalidate” Header unset ETag Header unset Last-Modified

5. Clean Up the Database

Word Press often auto saves everything, but the disadvantage is that your database will get filled with thousands of post revisions, trackbacks, pingbacks, unapproved comments and trashed items pretty quickly.


The solution to this is a fantastic plug-in called WP-Optimize, which routinely clears out your database’s trash, keeping the database efficient and filled only with what needs to be kept. Of course, when doing anything to your database, always back up first.

6. Minify CSS and JavaScript Files

If you’ve installed more than a handful of plug-in, chances are that your website links to 10 to 20 individual style sheets and JavaScript files on every page. This is not ideal. Putting all JavaScript into one JavaScript file and all CSS in one CSS file is considerably more efficient.

This is where minification comes in. Plug-in such as Better Word Press Minify will combine all of your style sheets and JavaScript files into one, reducing the number of requests that the browser needs to make.

Better Word Press Minify is less aggressive than some of the other plug-in that do the same thing (some of which cause problems, as Hristo Pandjarov outlines).

7. Turn Off Pingbacks and Trackbacks

Pingbacks and trackbacks are methods used by WordPress to alert other blogs that your posts link to. While sometimes interesting, they can be a drain on page speed and are usually better turned off. You can turn them off under the “Discussion” tab in “Settings.”

8. Specify Image Dimensions and Character Sets

Before a visitor’s browser can display your Web page, it has to figure out how to lay out the content around the images. Without knowing the size of these images, the browser has to figure it out, causing it to work harder and take longer.

Specifying image dimensions saves the browser from having to go through this step, speeding things up.

For the same reason, specifying a character set in your HTTP response headers is useful, so that the browser doesn’t have to spend extra time working out which one you’re using. Simply add the character set to your website’s head section.

9. Move CSS to the Top and JavaScript to the Bottom

Linking to your style sheets as close to the top of the page as possible is widely recommended because browsers won’t render a page before rendering the CSS file. JavaScript, on the other hand, should be as close to the bottom of the footer as possible because it prevents browsers from parsing anything after it until it has full loaded.

In the majority of cases, this simple fix will improve page-loading speed by forcing files to be downloaded in the optimal order. But it can cause issues on websites that rely heavily on JavaScript and that require JavaScript files to load before the user sees any of the page.

10. Use CSS Sprites

A sprite is essentially one large image file that contains all of your individual images next to each other. Using CSS, you can hide everything in the image except for the section you need, by specifying a set of coordinates.


CSS sprites speed up a website because loading one big image is much faster than loading a lot of small images.

The easiest solution is SpriteMe, a tool that turns all of your images into a CSS sprite.

Remember that Safari does not load large sprites, so use William Malone’s calculator to identify whether your sprite is too large.

11. Enable Keep Alive

HTTP Keep Alive refers to the message that is sent between the client’s machine and the Web server asking for permission to download a file. Enabling Keep Alive allows the client’s machine to download multiple files without having to repeatedly ask for permission, thus saving bandwidth.

To enable Keep Alive, simply copy and paste the code below into your .htaccess file.

Header set Connection keep-alive

12. Replace PHP With Static HTML Where Appropriate

PHP is great for making a website efficient and reducing the need to enter the same information multiple times. However, calling information through PHP uses up server resources and should be replaced with static HTML where it doesn’t save any time.

List of Essential Plug-in for WP

1. Akismet – best guard against comment spam for Word Press blog!


2. BackUpWordPress - will back up your entire site including your database and all your files on a

schedule that suits you.

3. All in One SEO Pack – Out-of-the-box SEO for your Word Press blog. Install the all in one seo

pack or the “Word Press SEO by Yoast” plugin (you don’t need to install both).

4. WordPress SEO by Yoast – Yoast’s all in one SEO solution for your Word Press blog: SEO

titles, meta descriptions, XML sitemaps, breadcrumbs & much more.

5. Google XML Sitemaps – This plug-in generates a XML-Sitemap compliant sitemap of your

Word Press blog. This format is supported by Ask.com, Google, YAHOO and MSN Search. The

SEO plug-in listed above can also do the sitemap for you.

6. All In One WP Security & Firewall – The All In One Word Press Security and Firewall is the

ultimate security plugin that will take your WordPress site’s security to a whole new level.

7. BulletProof Security – BulletProof security plug-in offers website security protection against:

XSS, RFI, CRLF, CSRF, Base64, Code Injection and SQL Injection.

8. Google Analytics for WordPress – This plug-in makes it simple to add Google Analytics with

extra search engines and automatic clickout and download tracking to your Word Press blog.

9. WordPress.com Stats – Tracks views, post/page views, referrers, and clicks. This plug-in

requires a WordPress.com API key to function.

10. W3 Total Cache – The fastest and most complete WordPress performance optimization plug-in.

After you use the w3 total cache plug-in you won’t go back to using WP Super Cache.

11. WP Super Cache – WP Super Cache is a static caching plug-in for Word Press. It generates

html files that are served directly by Apache without processing comparatively heavy PHP scripts.

By using this plug-in you will speed up your Word Press blog significantly.

12. FeedBurner FeedSmith – This plugin detects all ways to access your original WordPress feeds

and redirects them to your FeedBurner feed so you can track every possible subscriber.

13. Add to Any: Subscribe Button – Helps readers subscribe to your blog using any feed reader.

14. Category Specific RSS Menu – A simple WordPress plugin to add category specific RSS

subscription menu into your posts, pages, sidebars. Very handy when your blog covers multiple

topic from non related subjects.

15. Contact Form 7 – Contact Form 7 can manage multiple contact forms, plus you can customize

the form and the mail contents flexibly with simple markup. The form supports Ajax-powered

submitting, CAPTCHA, Akismet spam filtering and so on.

16. cforms – cforms II is the most customizable, flexible & powerful ajax supporting contact form

plugin.

17. WP Contact form – WP Contact Form is a drop in form for users to contact you.

18. Gravity Forms – Build and publish your Word Press forms in just minutes. No drudgery, just

quick and easy form-building.


19. Sociable – Automatically add links to your favourite social book marking sites on your posts,

pages and in your RSS feed.

20. Share This – This is a very useful plug-in that allows your visitors to share a post/page with

others. Supports e-mail and posting to social book marking sites.

21. Fat Free WordPress Social Share Buttons Plugin – This is a very simple and FAT FREE

share button plug-in that adds Google plus one, Face book and Twitter share buttons to your

blog posts.

22. Google Adsense Plugin – Google AdSense Plug-in allows you to set parameters of the ads

displaying, such as format (text ad, image, text with an image or link), size, colour of the

elements in the ad block, rounded corners and the ad block position on the website.

23. Simple Google Adsense insertion – Easy to use Word Press plug-in to insert Google Adsense

to your posts, pages and sidebar.

24. Adsense-Deluxe – Place Google AdSense ads in your Word Press Posts. Capable of handling

complex adsense management.

25. Simple Photo Gallery – If you are looking for an effective, reliable, yet simple to use photo

gallery plug-in, then check this gallery plug-in out

26. NextGen Gallery – The most popular Word Press gallery plug-in and one of the most popular

plug-in of all time.

27. WordPress Simple Paypal Shopping Cart – is a very easy to use plugin that allows you to sell

products or services online in one click from your WordPress blog. Very useful when you want to

sell eBooks or digital products from various posts and pages and need a WordPress Shopping

Cart solution.

28. WP Easy Paypal Payment Accept – This is a very easy to use WordPress plugin to Accept

donation or Paypal payment for a service or a product in one click. Handy when you are trying to

put a customized payment widget on your site (you can add it to the sidebar or a page or a post

of your blog).

29. WordPress eStore – This plugin provides a complete solution to sell products from your site. It

is really good for selling digital products securely from your WordPress blog.

30. WordPress Donations Plugin – The WordPress Donations Plugin allows you to collect

donation for a cause from your WordPress powered site.

31. PayPal for Digital Goods – This plugin allows you to use the PayPal for Digital Goods gateway

to accept payment for digital goods. Provides inline checkout of digital goods.

32. Simple Membership Plugin – The simple membership plugin lets you protect your posts and

pages so only your members (free or paid) can view the protected content.

33. WordPress eMember – WP eMember is a feature rich membership plugin that can turn your

existing or new WordPress site into a powerful membership site.


34. WP Affiliate Platform – WordPress plugin for affiliate recruitment, management and tracking.

This plugin lets you run your own affiliate campaign/program and allows you to reward (pay

commission) your affiliates for referred sales.

35. WordPress Affiliate Link Manager – Allows you to automatically convert specific keywords

from your blog posts and pages into your affiliate links. It also cloaks the affiliate links and gives

it a prettier and shorter alias (good for affiliate marketers).

36. Yet Another Related Posts Plugin – This plugin gives you a list of posts and/or pages related

to the current entry, introducing the reader to other relevant content on your site.

37. Download Monitor – This plugin is very useful for managing and tracking your digital file

downloads. You can track which file is being downloaded how many times and who is

downloading them.

38. Simple Tags – It makes WordPress Tagging life so much easier. It helps with Auto completion,

Suggested Tags, Tag Cloud Widgets, Related Posts, Mass edit tags.

39. Executable PHP Widget – Like the Text widget, but it will take PHP code as well. Very handy

for inserting custom ‘php’, ‘html’, ‘javascript’ in the sidebar.

40. Crayon Syntax Highlighter – A plugin to highlight any code in your posts or pages. very

handy if you use example codes in your Blog.

41. Mailpoet Newsletters – Send newsletters, post notifications or autoresponders from

WordPress easily, and beautifully.

42. WP-Polls – Adds an AJAX poll system to your WordPress blog. Allows you to easily include a poll

into your WordPress’s blog post/page.

43. EWWW Image Optimizer – The EWWW Image Optimizer is a WordPress plugin that will

automatically and losslessly optimize your images as you upload them to your blog.

44. WP Video Lightbox – The WordPress Video Lightbox plugin allows you to embed videos on a

page using lightbox overlay display. This plugin can be used to display images, flash, YouTube,

Vimeo, iFrame etc in a nice lightbox overlay.

table of contents · look for a file named wp-config-sample.php and rename it to: wp-config.php now...

Documents