Nov 242017
 

 

 

How to add a widget in WordPress

WordPress Widgets add content and features to your Sidebars.

We will cover how to add a Wealthy Affiliate banner to a sidebar widget in a minute, first let’s take a look at where to find “Widgets” and how to work with them. 
 

Where do I find a “Widget” 

    First you have to log in to your site:

    Wealthy Affiliate: 

 

    In the dashboard mouse over ( point to ) “Appearance” and click  “Widgets”

 

 *  Your’s will look different depending on what theme you are using.  

   

Example:  This is a small screen shot of the widgets available in the “Suffusion” theme:

This is the left side of the Menu, on the right side there is a column of widgets that you can ADD from the left side:

For example,  I have ” Custom menu” “Recent Posts”, “Text” widgets.

 

 

How to add a widget?

Find the widget on the left side, drag and drop it where you want it to go on the right side.

* to drag and drop – left click your mouse on the widget from the left side that you want to add, drag your mouse over to the right side to where you want it to go, to drop it let go of the mouse 

     

Example:  I want to add a “Calander” widget under the  2 “Custom Menu” widgets.

First:  I left click on the “Calander” widget  (the cursor will turn into a little hand)

now I drag ( hold down the left button)  my mouse to the right.

I want it under the Custom Menu widgets, so I point my mouse to the space between the second “Custom Menu” widget and “Recent Posts” 

( a blank box opens)  like a guide to show you where the widget will be set, when I have the blank box where I want it, I let go of the mouse

The “Calander” widget drops into the blank box.

Click “Save” when you are done.

 

 

How to add a Wealthy Affiliate banner into sidebar widget:

    First you have to log in to your site:

   Wealthy Affiliate:

When you login to your site a new tab will open and you will be on your dashboard. Keep the second tab open for the next step. 

 

In the dashboard mouse over ( point to ) “Appearance” and click  “Widgets”

* Yours will look different depending on the theme you are using

You will be adding the banner to a TEXT widget.  If you don’t have a “Text” widget on the right side, drag and drop one over ( like in the example above with the “Calander” widget) from the left side.

 

    Go back to the Wealthy Affiliate tab 

 Under the Main Menu Scroll down and click on the “$WA Affiliate Program” link  then click “Banners”

For this example, I chose “this little square will change your life today…”

 

Copy the HTML code ( left click at the beginning of the code and drag your mouse to the end of the code, and right click “copy”).

      Go back to the widget tab

    

Click the down arrow to open the “text” box, and paste the code you copied from the banner HTML Code box

When you paste the code it will look like this

        

Click “SAVE” and you are done.

 

 

* I recommend viewing your site and making sure that the banner looks okay, (that it fits in the box, goes with your theme). I would also click on the banner and make sure that it is working correctly.  

~  The first thing that you should check if it is not working right is the HTML code. Make sure you copy the whole thing, and that you don’t have any spaces before or after the code. 

~  If you are still having a problem jump in and ask for help, Wealthy Affiliate has training, tutorials, blogs, a live chat, and an activity board where you can ask a question.

~  Also check out the widget page in WordPress Codex Resources

 

 

Some tutorials you may be interested in:

* this is an older video so the main menu looks different now, instead of clicking “stats” like the video, click on the “$WA Affiliate Program” link under the main menu, then click “Banners” 

 

Thanks for stopping by,

Kerri

EMAIL ME ANY QUESTIONS/ CONCERNS, I’M HERE TO HELP YOU !   kerri@createuronlinebiz.com    

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)