1. Home
  2. Appearance
  3. Widgets ( Sidebar )

Widgets ( Sidebar )

Widgets are the content boxes that appear on the sidebar of your website.


How to Add Widgets

Instructions

  1. In WordPress click Widgets under Appearance on the sidebar.
  2. Click and drag the widgets to the sidebar of your choice.
  3. Edit the widget information and click the Save button.

For version 2.18 and above:

  1. Beat Store Homepage – Appears on beat store homepage and beat sort pages.
  2. Single Beat Page – Appears on the single beat page.
  3. Blog Homepage – Appears on the blog homepage.
  4. Blog Single – Appears on single blog post pages.
  5. Static Pages – Appears on static pages.
  6. Three Footer Widgets – Appears in the footer of your website.

For version 2.17 and below:

  1. General Sidebar – This sidebar appears on the blog and static pages.
  2. Beat store & Genre Page Sidebar – This sidebar appears on the beat store homepage and the beat sorting pages.
  3. Single Beats Sidebar – This sidebar only appears on the single beats page.
  4. Three Footer Widgets – Appears in the footer of your website.

Available Widgets

New Beats Widget

Newest Beats

Random Beats Widget

Random beats

Beat Sorting Widget – Allows you to sort beats by Genres, Categories, and Tags.

Sort Beats Widget

Beat Sorting ( Dropdown )

sorting widget

Beat Buying Steps Widget

Beat Buying steps

Beat Shopping Cart Widget – This widget is called Downloads Cart on the widgets page.

Beat cart

Social Profile Links

social widget

About Widget

about widget

 Photo Gallery Widget

photo gallery

 Image Banner Widget

Image Banner

YouTube Widget

youtube

Vimeo Widget

Vimeo Widget

Text Banner

Text banner

Testimonial Widget

Testimonial Widget

Text Widget – This widget allows you to insert any text or HTML code you like.

text widget

Recent Blog Post Widget

Recent Blog Post

Facebook Widget

Facebook Widget

Blog Tags Widget

Blog Tags

Blog Categories Widget

Blog Categories

Events Widget

Events


Add Beat Shopping Cart Widget

Here are the steps to add a shopping cart widget like the example below.

  1. In WordPress click Widgets under Appearance on the sidebar.
  2. Click open the sidebar you would like to add the widget too.
  3. Drag and drop the Downloads Cart to the sidebar.
  4. Give the widget a title and click Save.

Instagram Widget

Here are the steps to install an Instagram widget.

Preview

instagram Widget

1. In WordPress under Plugins click Add New.

2. In the search input on the top right of the page, enter Enjoy Instagram and hit enter on your keyboard.

3. Click the Install Now button, then click Activate Plugin.

Enjoy Instagram

4. Under Settings on the sidebar, click Enjoy Instagram.

5. Click the Connect Your Account button.

6. Enter your information to log in.

7. Click the settings tab.

8. Select the grid settings you want and click Save Settings.

grid settings

9. Under Appearance on the sidebar click Widgets.

10. Select a Text Widget and drag it to the sidebar you want the widget to appear on.

text widget

11. Give the widget a title and paste in this short code [enjoyinstagram_mb_grid]. Click Save.


Twitter Widget

In this video I’m going to show you how easy it is to add a Twitter widget to your website.

1. Visit: https://twitter.com/settings/widgets. This is the page you will need to visit to create the widget. You will have to be logged into Twitter to view this page.

2. Click the “Create New” button.

Twitter Widget

3. Enter your Twitter username and click the “Create Widget” button. Copy the code provided below the widget and paste it where you would like it to appear on your website.

4. By default the widget will not have a height and width set, so you can easily copy and paste code this code

height=”240″ width=”270″

after you see this class=”twitter-timeline” in the code provided by Twitter.


Widget FAQs

Does your theme come widget ready?
Yes. This theme includes sidebars and a footer that supports multiple widgets.

Can I change the widget width?
No, there is no easy way to change this.

Fix Floating Widget Content
To fix this problem you want to add some CSS code to make the div around the content float left.

Screen Shot 2014-03-13 at 9.04.50 AM

If you added HTML to a text widget that is floating outside of the widget box, take the code below, and place your HTML in the middle where it says HTML goes here.

<div style="float:left;" >

<!-- HTML code goes here -->

</div>
Updated on October 24, 2017

Was this article helpful?

Related Articles

Comments

Leave a Comment