WordPress Blog

Manage Public Institutions WordPress theme with ease.

We've prepared a set of tutorials for Public Institutions WCAG ready WordPress theme. Browse the topics from the menu on the right side and follow instructions and find out more interesting features that this awesome WordPress theme brings you.

The following tutorials are the extended guides for sections described in the Public Institutions WordPress theme manual available online or downloadable at your account (for active subscribers of Public Institutions WordPress theme).

How to find a WordPress widget easily?

Widgets are a simple and easy-to-use way of giving design and structure control of the WordPress Theme. Widgets' sidebars available in a WordPress theme are related to the design and layout of your site.

They can be found on the Appearance » Widgets page in your WordPress dashboard area.

It may happen that you have no idea where to find the widget on the front page.

For this purpose, you should use the PE Theme Elements Info plugin and get info about sidebars and widgets types. 

Let's see how it works.

The plugin you can find and download for free here: https://www.pixelemu.com/wordpress-plugins/pe-theme-elements-info

After downloading the plugin, it is required to install it at your WordPress website backend. Log-in to your admin panel, go to “Plugins” and choose “Add new”.

Use the “Upload Plugin” button and choose the file from your disk.

After the successful upload and installation, use the “Activate plugin” button.

The plugin is now enabled and should be visible on the list of installed plugins. Later, when the work is done, you can stop using the plugin, by clicking the “deactivate” button.

Now go to your WordPress website front page, refresh it and you will see the result there.

Remember - you need to be logged in as an administrator to see the theme's elements info.

As you can check on the screenshot example below, there is a small box with the Sidebar name and a Type informing you about the widget location and type to find it easily.

• The first one is placed at the Top2 position (sidebar) and the widget type is “Text”
• The second one is placed at the Top2 position (sidebar) too and the type is “PE Recent Posts”

This way, you can check each widget location and find it easily in Appearance » Widgets in WordPress backend.

How to change the email address and phone number above the logo?

The Public Institutions demo site contains a widget displaying email and phone number contact details. That widget is placed at the top of the front page.

For this purpose, we have used a simple text widget. Let’s see how it’s setup. 

Open your WordPress dashboard.  Navigate to “Appearance” -> “Widgets”. There is a “Text” widget on the list.

After assigning the widget to the chosen position (in this case, it’s “Top Bar 1”.), you can configure it.

See our example below. We have not used the “Title.” It’s about filling up the “Content” box with  HTML code only:

If you want to change the email address and phone number, you can easily do this by editing the content (for customers who installed the demo copy).

How to manage accessibility tools above the menu?

WCAG tools icons you’ll find at the top-right corner of the Public Institutions WordPress theme demo site.

Icons are divided into three categories: Contrast, Layout, and Font. Each category has few icons to use. Using these tools will help visually disabled website visitors to navigate across the website. Remember that it’s only the demo example here. Icons can be easily defined in the backend of the website. Go to your WordPress admin panel.

Navigate to “Theme Options” and then to “Accessibility.”

Now you have a high number of accessibility settings to configure. Settings responsible for icons used on the front-page are:

• Wide layout (Enable / disable wide layout.)
• Font sizer (Enable / disable font sizer.)
• Night mode (Enable / disable night mode.)
• (High contrast mode)

But there are also other WCAG settings that you can manage. Check here the detailed description of each WCAG settings section.

How to change the logo?

The Public Institutions WordPress theme uses a logo on the front page - in the top position, left to the menu.

Changing the logo is an easy task. Open your WordPress dashboard. Navigate to “Theme Options” -> “Basic Settings” -> “Logo.”

You can upload any image of your choice there and remove the existing one. After Saving the settings, the new logo will appear on the front page.

How to manage the CONTACT US form?

The contact form on the Public institution WordPress theme demo site looks like this:

Let’s see how to manage the contact form.

Gathering contact details

Open your WordPress admin panel and navigate to “Theme Options” -> “Pages” -> “Contact.”

As you will see, there are many options to use - contact details that can be displayed on the Contact Page or with a Contact widget.

All options are in one place; while turning on selected sections, a given section’s options will appear. Enabling the google map feature will cause that options such as latitude, longitude, and zoom will appear on the list.

• Google Map - Enable / disable google Maps (Google Maps API must be enabled. Please check the Advanced tab.)
• Latitude - Provide google map latitude
• Longitude - Provide google map longitude
• Zoom - Provide google map zoom level
  
  

• Tooltip  -  Show tooltip with address / coordinates
• Contact form - Enable / disable contact form
• Email recipients - Provide an email address that will be used to receive messages
• Contact details - Enable / disable contact details 
• Email address  -  Provide the email address that will be displayed
• Contact address - Here, you can provide the address. Shortcodes, links, and media attachments can be used
  
  

• Consent 1 - Require consent 1 to send the form
• Text for consent 1 label (HTML allowed) - provide the constent content
• Consent 2 - Require consent 2 to send the form
• Text for consent 2 label (HTML allowed)  - provide the constent content
• Spam Protection - On/Off
  
  

How to display the contact form?

You can create a menu link and assign it to the Contact page or display the context form using the Contact widget.

Displaying the contact form with the Contact widget

Let’s see how to configure the “contact form” widget - the one you can see on the Public Institutions WordPress theme demo site. Navigate to Appearance -> Widgets and find the “PE Form” widget on the list. Add it to the chosen widget position.

Most essential settings have already been described (in the Theme Options related section). The PE Form widget is used to display the contact form with previously described setting, but you can also define a title and description. The remaining options are used to specify where you want the widget to appear. 

How to modify the VIDEO widget?

You can add a video to the WordPress website. Our Public Institutions demo example contains such an element on the front page.

Let’s see how to manage the widget responsible for displaying the video. This video is shown in the “Content Bottom” position using the “Text” widget and the widget size is set 50% for desktops.

Open your WordPress dashboard. Navigate to “Appearance” -> “Widgets”. The “text” widget appears on the list there.

After assigning it to the appropriate position, or when editing an already configured video widget, it looks like this:

As you can see, we’ve only set the title “VIDEO” and the Content box with the “iframe code” for a selected YouTube video. You can remove this code and replace it with a code of your choice.

How to change images for the AWARDS & MEMBERSHIPS section?

The  “Awards and memberships” section is placed at the bottom of the demo site. It displays five company logos. For this purpose, we are using the PE Easy Slider widget. 

We will show how to change the displayed images there. Open your WordPress dashboard. Navigate to Appearance -> Widgets -> PE Easy Slider

Our demo example displays the widget at the Bottom 3 position. Let’s see widget settings:

The most important element for us here is the “Source.”  Users can choose between “Posts” and “Folder as a source.” Our images are implemented from the folder defined in the next field “Image Folder.” Images from this folder will be displayed via the widget.

You can define the number of rows and the number of items in a row.

How to set social icons and links?

The Public Institutions WordPress theme’s demo displays Twitter, Facebook, and Google plus social icons in the “Footer” section.

For this purpose, we’ve used the PE Social widget. Icons links can be easily modified using this widget.

Add the PE Social Icons widget

To find and add the widget to your site, open your WordPress panel, and navigate to “Appearance” and to “Widgets”. Find PE Social on the list and click it. Now you can choose the position, where you want to place it. At the end click the “Add widget” button.

Let’s see the widget main settings: 

Edit or add a social icon item.

The social icon link can be modified in the item edition field. I will show it on the Facebook icon example:

You can “Add new item” or edit the existing one. As you see, I’ve used the “Edit” button for the Facebook item.

After clicking the edit field, the box with “name, icon, and URL” appeared. These settings allow you to add any social media link of your choice. That is very easy to configure. After filling in the options click “Save item” button and click "Save" - the widget button.

For icons use font awesome icons classes -> https://fontawesome.com/icons?d=gallery

How to change copyrights details?

The Public Institutions WordPress theme demo example has a copyright text at the bottom of the website. 

It’s easy to change the text included there. See how to do it.

Open the WordPress backend. Navigate to the “Theme Options” and then to “Footer”.

You can configure the following options. 

Copyright Info - On / Off - Enable / disable copyright info. If you set on "Off" then the copyright text on the left bottom corner disappears.

Copyright text - Add text for copyright info at the bottom of the page (the “Copyright Info” button must be set as “On”.)

PixelEmu copyright - On / Off  - Enable / disable PixelEmu copyright.

After completing the settings click the "Save changes" button. 

How to manage widgets in the footer area?

The footer section of your website can display widgets. Users browsing the website will see the footer if they scroll to the bottom of your page. You can use the footer section to display important information. 

The Footer section should be easy for the user to read and allow him to locate what he is looking for quickly.

The Public Institutions WordPress Theme demo example uses this area for: 

• Public institution information
• About us information
• Our company information
• Contact info
  
  

Let’s focus on each widget now.

Public Institution

It’s a text widget. It contains a logo a short description.

About

It’s a Nav menu type widget. It displays a set of links directing to various places on the website.

Our company

It’s a Nav menu type widget. It displays a set of links directing to various places on the website.

Contact info

It’s a text widget. It displays small icons along with descriptions.

Widgets Configuration 

Open your WordPress dashboard, navigate to “Appearance” -> “Widgets”.  

Both mentioned widget types you can find on the widgets list:

Of course, you can use any other type of widget for the Footer. We just use our solution as an example here.

Now, navigate to the right side of the widgets page and you’ll find the “Footer” section. It includes all four widgets displayed on the front page.

Public institution - As you can see on the image below, this widget has a defined “Title” and it uses the HTML code in the content.

About us -  As you can see on the image below, this widget has a defined “Title” and it displays the link structure from the selected menu: “About”.  The menu is configured in the Appearance -> Menu

Our company -  As you can see on the image below, this widget has a defined “Title” and it displays the link structure from the selected menu: “Our company”. The menu is configured in the Appearance -> Menu

Contact info - As you can see on the image below, this widget has a defined “Title” and it uses the HTML code in the content.

From the Typography tutorial, you may get the ready code for font awesome usage - check section FONT AWESOME.

How to get search widget below header?

The Public Institutions theme’s demo displays a “Search” widget on the front page, right below the slider. 

Let’s see how to place it there. 

Open your WordPress admin panel. Navigate to “Appearance” and then to “Widgets.” Find “Search” on the list of available widgets.

You can assign the search to a chosen position. 

On the Public Institutions demo site, the “Search” box is assigned to the “Top 1” position.

How to manage POPULAR RESOURCES widget?

“Popular Resources” is a widget displayed on the Public Institutions demo site in the “Top 2” position and the widget size is set 33% for desktops.

Let’s see how to manage it. 

Open your WordPress admin panel. Navigate to “Appearance” and then to “Widgets.” Find “Text” on the list of available widgets.

After opening the widget, you can add it to a chosen position. 

“Popular Resources” is a text widget. Our example is displayed at the “Top 2” position and uses a shortcode code that displays icons and short information. The content includes the links to a few posts from the blog.

Get the shortcode from our examples demo site. It's the ICONTEXT shortcode placed in GRID shortcode.

How to manage LATEST NEWS widget?

“Latest News” is a widget displayed on the Public Institutions demo site in the “Top 2” position and the widget size is set 33% for desktops.

Let’s see how to manage it.

Open your WordPress admin panel. Navigate to “Appearance” and then to “Widgets.” Find “Pe Recent Posts” on the list of available widgets.

After opening the widget, you can add it to a chosen position. “Latest News” is based on PE Recent Posts widget that you may download for free.

For our example, we’ve used the custom configuration displaying posts intro content with linked titles. The read more button is disabled but of course, it can be also used there.

The user may select the category or display items of all categories. Users can also define how many rows will be visible in a column and how many items will be displayed in one row.

There was not much space in the box, so the information contained is very concise, but also very clear. There are a lot of options to set.

Let’s see the settings on the screenshot:

How to manage UPCOMING EVENTS widget?

The Public Institutions demo site displays a section with upcoming events. For that, we are using a WordPress widget.

Let’s see the widget displayed on the front page:

Our example includes a title, link to all events and three events.

Manage events

Before displaying the widget on the front page, it is required to create events. For this purpose, the Public Institutions demo uses a "The Events Calendar" plugin.

The installed plugin you can find in the WordPress dashboard.  Navigate to “Events” icon, open it, and you will see the list of created events.

Of course, you can add new events, create event categories, manage tags, venues and use more options.

Created events that are available on the list can be displayed on the front page using the widget.

Manage the Events List Widget

Go to “Appearance” -> “Widgets” and find the “Event list” widget on the list.

We have used the widget in our demo example, and it’s displayed in the “Top 2” position and the widget size is set 33% for desktops. You can add the widget to any theme’s position or use it in the “Top 2”.

Open the widget and check it’s settings:

Check Events calendar documentation here.

How to manage TASKS OF COMMUNE section?

The Public Institutions theme’s demo site comes with a section called “Tasks of commune”.

For this purpose, we’ve used the PE Easy Slider widget, which is placed in the "Top 3" position.  The widget displays a set of images with the linked title.

See the example below:

Let’s check how to manage this widget. 

Open your WordPress dashboard. Navigate to “Appearance” -> “Widgets” -> “PE Easy Slider”.

You can set the position, and add the widget where it should be displayed (Top 3 position is used for our demo example). After adding the widget, you can open it and configure.

Let’s take a look at available options:

Learn more details about PE Easy Slider plugin here.

How to change content for Public Institutions WordPress Theme section?

The Public Institutions demo site front page includes the “Public Institutions WordPress Theme” section. The content comes from the page with the same title and it's displayed in the main content area of the theme's layout. 

How to change the content?

Open your WordPress dashboard. Navigate to “Pages” and find the “Public Institutions WordPress theme” on the list.

Open this Front Page page to edit the content. It uses the classic WordPress editor - you can add links, include images, videos and slider.

How to modify INFO menu?

The “Info menu” is displayed on the theme’s demo front page in the “Info” section.

For this purpose, we’ve used the “Navigation Menu” widget, which is displayed in the “Content bottom” position and the widget size is set 25% for desktops.

How to modify the menu?

Open your WordPress dashboard. Navigate to the “Appearance” -> “Menus” and find the “Info” menu on the list. Now you can edit this menu structure.

It’s about creating or editing the existing menu. Our structure is an example only. You can add more items using Pages, Posts, Events, Custom links, Categories, Tags or event categories.

Just remember the menu name - it will be needed later for the widget configuration.

How to configure the widget?

Open your WordPress dashboard. Navigate to the “Appearance” -> “Widgets” -> “Navigation Menu”

Navigation Menu settings:

You can set the title and choose the menu you want to display using this widget.

How to modify STAY INFORMED items?

The Public Institutions theme’s demo site includes a section called “Stay Informed”. For this purpose, we’ve used the PE Recent Posts widget, which is placed in the "Content Bottom" position and the widget size is set 25% for desktops.

That section displays titles along with the short description, linked to selected pages on the website.

See the example below:

Let’s see how to manage this widget. Open your WordPress dashboard. Navigate to “Appearance” -> “Widgets” -> “Pe Recent Posts”.

You can set the position, and add the widget where it should be displayed (Content bottom position is used for our demo example). After adding the widget, you can open it and configure.

Learn more about PE Recent Posts plugin here.

How to modify the counter?

The Public Institutions demo site contains an eye-catching counter on the front-page. It’s the text widget with a counter shortcode used for this purpose here.

Let’s see how to manage it. Open your WordPress dashboard. Navigate to “Appearance” -> “Widgets” -> “Text”. You can assign this widget to any theme’s position. Our widget is displayed in the “Bottom 1” position.

Let’s open the widget settings:

As you can see on the image above, the widget is based on the shortcode code, displaying such elements as the icon, title (that can be linked), and the number.

You can add your links, set the number, and change the names.

Get the shortcode from our examples demo site. It's the COUNTER shortcode placed in GRID shortcode.

How to manage INTERESTING TUTORIALS widget?

The Public Institutions theme’s demo site includes a section displaying most interesting tutorials. For this purpose, we’ve used the PE Panels widget, which is placed in the "Bottom 2" position and the widget size is set 50% for desktops.

Tutorials are displayed in the collapsed view, one by one. Each title can be clicked, and this way, you open the information for the selected tutorial. The extended view shows off the title, small image and the description. We have only used some of the possible settings - some are disabled for this view.

See the example below:

Let’s see how to manage this widget. 

Open your WordPress dashboard. Navigate to “Appearance” -> “Widgets” -> “PE Panels”.

You can set the position, and add the widget where it should be displayed (Bottom2 position is used for our demo example). After adding the widget, you can open it and configure.

Learn more about PE Panels settings here.

How to manage the main slider?

The Public Institutions demo site includes a slider on the front page. The slider is displayed in the “header’ position. The slider is based on the “Slider Revolution” WordPress plugin and placed in that position using the Rev Slider Widget.

How to manage the slider?

As the first thing, it is required to set up the slider. You can create your own slider, but we will show the view and options for our slider configuration.

Open your WordPress dashboard, find the “Slider Revolution” on the list and open it.

Now you can find the configured slider there. Each plugin’s item is called Module. Our example module comes with the “Header Home” name.  

By hovering the mouse over you’ll see two icons: Open in editor/show slides. Both options will direct you to the editor, but clicking on the “image” icon first, you can open another view and see the slides’ list.

Let’s open the editor. As you can see, there are tons of options to use. We won’t focus on each option now, but the possibilities are enormous.

Rev Slider widget settings

After setting up the slider in the plugin, it is required to display the widget on the front page or selected pages. In your WordPress dashboard navigate to “Appearance” -> “Widgets” -> “Slider Revolution”.

You can place the widget where you want. Our example is displayed in the “Header” position (so you can find it there). There are only a few options in the widget configuration.

• Title - enter the title if needed
• Choose slider - choose the name of the configured slider from the list.
• Home Page Only - select it if you want to show off the slider on the home page only.
• Pages - you can define on which pages you want to display the slider.

Customer's Question:

I’ve downloaded and activated the WordPress theme on my site, and also imported the demo content through the uploader. How do I create new pages using the template theme? It only seems to be giving me regular WordPress options. I have all the other necessary plugins installed and activated.

Solution:

Pages / views of a WordPress theme are created using widgets and sidebars. You will find info about sidebars and widgets in the documentation of your purchased WordPress theme (here are all WordPress themes manuals available online). 

Look for the Plugins and Widgets section and Other sidebars section. For example, for Eco Energy WordPress theme it looks as follows:

• Plugins and Widgets
• Available sidebars
  
  

And we also recommend using PE Theme Elements Info plugin, so you can check on each page what sidebar and widget type is used.

Question:

How to make a category page displays more than 4 posts? I want to display more posts on the first page of my blog category view.

Solution:

You can change posts per page value in WordPress dashboard -> Settings -> Reading:

Manage Eco Energy WordPress theme with ease.

We've prepared a set of tutorials for Eco Energy WCAG ready WordPress theme. Browse the topics from the menu on the right side and follow instructions and find out more interesting features that this awesome WordPress theme brigs you.

The following tutorials are the extended guides for sections described in the Energy WordPress theme manual available online or downloadable at your account (for active subscribers of Eco Energy WordPress theme).

How to find a WordPress widget easily?

Widgets are a simple and easy-to-use way of giving design and structure control of the WordPress Theme. Widgets' sidebars available in a WordPress theme are related to the design and layout of your site.

They can be found on the Appearance » Widgets page in your WordPress dashboard area.

It may happen that you have no idea where to find the widget on the front page.

For this purpose, you should use the PE Theme Elements Info plugin and get info about sidebars and widgets types. 

Let's see how it works.

The plugin you can find and download for free here: https://www.pixelemu.com/wordpress-plugins/pe-theme-elements-info

After downloading the plugin, it is required to install it at your WordPress website backend. Log-in to your admin panel, go to “Plugins” and choose “Add new”.

Use the “Upload Plugin” button and choose the file from your disk.

After the successful upload and installation, use the “Activate plugin” button.

The plugin is now enabled and should be visible on the list of installed plugins. Later, when the work is done, you can stop using the plugin, by clicking the “deactivate” button.

Now go to your WordPress website front page, refresh it and you will see the result there.

As you can check on the screenshot below, there is a small box with the Sidebar name and a type. So, it’s placed in the Header Sidebar and the widget type is Text.

Remember - you need to be logged in as an administrator to see the theme's elements info.

Let’s take a look at another example. As we scroll down the front-page there are two infoboxes for two widgets:

• The first one is placed at the Top2 position (sidebar) and the type is “Media Image”
• The second one is placed at the Top2 position (sidebar) too and the type is “PE Best Features”

That is all. This way, you can check each widget location and find it easily in Appearance » Widgets in WordPress backend.

How to change the logo and menu position in the WordPress theme settings?

You can easily change the position of the logo and menu in the Eco Energy WordPress theme. The default view used for the demo site uses a centered menu and logo.

Let’s check the possible options. Log-in to your WordPress website backend. Go to "Theme Options" and navigate to the "Main Menu" on the list.

Now you can define the “Menu position” setting depending on your needs.

Three options are available to choose:

• Center menu and logo
• Menu on right / logo on left
• Menu on left / logo on left

The default view for Eco Energy WordPress theme demo looks like this (It’s the center menu and logo):

The view with Menu on right / logo on left looks like this:

And the view with Menu on left / logo on left looks like this:

How to manage WordPress theme's menu links?

See how to add a link to the menu in WordPress. Menus in WordPress may contain links to pages, categories, custom links, or other content types.

Log into your WordPress administration panel. Navigate to Appearance, and select Menus:

Now let’s add a new menu item.

Choose (for example) the “Custom link” from the list. Type in the URL you want to have for this menu button, the link text, and then click Add to Menu:

As you can see in the screenshot below, the new menu item appears on the Menu structure (1). It’s on the top because I’ vee used the “To the top” button for a better view here. The “Test” item (2) can still be edited so that you can change the name and the link. Don’t forget to use the “Save menu” button (3).

This way, you can create and manage all menu items. You can also move items up and down to change their order.

Refresh the site, and you will see your new custom page and link in the navigation menu. Below see the final effect on the front page:

How to manage WCAG tools icons in WordPress theme?

Using web accessibility tools enable you to easily follow the Web Content Accessibility Guidelines (WCAG) across all conformance levels.

WCAG tools icons are available at the top-right corner of the Eco Energy WordPress theme demo site.

Click on the icon, and a box will open with a set of options to use. These tools will help visually disabled website visitors to navigate across the website.

Options used for this demo site are divided into three main categories:

• Contrast
• Layout
• Font
  
  

But it’s only an example. The content of this box can be easily defined in the backend of the website.

Go to your WordPress admin panel. Navigate to “Theme Options” and then to “WCAG & ADA.”

Now you have a massive number of available accessibility settings to configure. The ones you see in the WCAG tools box are:

• Wide layout (Enable / disable wide layout.)
• Font sizer (Enable / disable font sizer.)
• Night mode (Enable / disable night mode.)
• (High contrast mode)
  
  

But there are also other WCAG settings that you may also manage. Check here the detailed description of each WCAG settings section.

How to manage the Services section placed in tabs WordPress plugin?

The services section from this demo site of the Eco Energy WordPress theme is a place for some description of the services. It's the right place to present information about the company's offer and then optionally redirect to the full info.

The Eco Energy demo site brings a Services section divided into four tabs. Each tab displays a specific post's content. For this purpose, we have used PE Panels WordPress widget.

How to configure a tabs widget?

We will show you how to configure and manage this widget to achieve the same effect with the tabs' content.

Open your website WordPress dashboard. Navigate to “Appearance” -> “Widgets”. Find PE Panels on the list, open it, set the position you want to place this widget, and then click the "Add widget" button.

TIP: Check here available sidebars in the Eco Energy WordPress theme.

The tabs and the accordion widget can display pages or posts. The main view can be "Tabbed" or "Collapsed (accordion). The essential options configure here, you can see on the image below:

1. Set the title
2. Set the view as “Tabbed” to get the tabs effect
3. Choose and assign “pages” if you want to include them in tabs
4. Choose and assign “posts” if you want to include them in tabs
5. You can set the order of displayed posts (or pages) by entering their ID’s

There are many more options to choose from, including content limit, read more button, article thumbnail, subtitle, and date. You may control the unlimited number of panels and their ordering.

After the successful configuration of the widget, please use the "Save Widget" button.

How to change testimonials content with a handy WordPress widget?

The testimonials example used on the Eco Energy WordPress theme demo site is the “They say” section.

The section is consistent but in fact, in the backend, it is divided into two widgets.

The left part is using the Testimonial Carousel widget. And this widget displays the content of the testimonial. Let’s see where to find and manage this content.

How to manage testimonials?

Open your WordPress dashboard. Navigate to “Testimonials” in the left panel and click it. You will open the list of existing testimonials. There is also an “Add new” option available ( you can create a new testimonial here.)

Choose the first item from the list and click it to open.

Single testimonial content settings

You can edit the title (1), permalink (2), and the main content (3) using the editor.

Under this area, you will see additional two boxes:

In the first one, you can provide a testimonial occupation or company.
The second box displayed the list of revisions.

On the right, under the “Publish” box, you will see the “Avatar image” box. It can be used to upload the featured image for this single testimonial.

Single testimonial item view in the widget

Let’s see this single testimonial on the front page displayed with the Testimonial Carousel widget.

It contains all defined elements including:

• The title ( Elizabeth Curly)
• Profession
• The content
• The avatar image
  
  

How to modify social icons links in the WordPress theme?

The Eco Energy WordPress theme’s demo example displays Twitter and Facebook social icons in the “Follow us” section placed in the footer.

For this purpose, we’ve used the Social Icons widget. Icons links can be easily modified using this widget.

Add the PE Social Icons widget

To find and add the widget to your site, open your WordPress panel, and navigate to “Appearance” and to “Widgets”. Find PE Social on the list and click it. Now you can choose the position, where you want to place it. At the end click the “Add widget” button.

Let’s see the widget main settings:

Edit or add social icon item

The social icon link can be modified in the item edition field. I will show it on the Facebook icon example:

You can “Add new item” or edit the existing one. As you see, I’ve used the “Edit” button for Facebook item.

After clicking the edit field, the box with “name, icon, and URL” appeared. These settings allow you to add any social media link of your choice. That is very easy to configure. After filling the options click “Save item” button and click "Save" - the widget button.

How to replace images in the carousel widget in the WordPress theme?

The images displayed in the carousel are displayed on the Eco Energy demo site in the “Resources carousel” section. 

The section itself contains the content in a simple and transparent appearance. The PE Image Carousel widget is an addition here, attractively displaying the images.

Add the Carousel widget

Open your WordPress control panel. Navigate to “Appearance” -> “Widgets”.  Find the “Image Carousel” on the list and click it. Now you can choose the position and add the widget there.

Add images to the Carousel widget

This widget has few useful configuration options, including the possibility to show/hide indicators, show/hide prev/next buttons, use the loop carousel, use the scroll wheel, and choose three different styles.

For us, the issue of adding images is the most important here. The widget has a “Add new item” button under the title. It is purposed for adding images.

Click the Add new item button (1). Now you can configure a few options.

Use the “Select image” button (2) to upload the image. You can upload files or add the image from the media library.

Type the image’s URL (3) if you want to link it. Save the item or use “Cancel” (4).

After adding the image, it’s visible on the list.

You can edit the item or remove it.

Are there other views for search input?

The search input is placed in the top bar on the right side of the top menu.

How to change the search input view?

Open your WordPress admin panel. Navigate to “Theme Options” and then to “Basic Settings.”

Scroll down to “Search form in topbar” options.

You can enable/disable the search form or choose between two views: Standard and Modal Window.

Standard view: the search input appears after clicking on the search icon.

Modal window view: after clicking on the search icon the modal window appears with the search input inside.

How to change copyrights text in the footer area?

The Eco Energy WordPress theme demo example has a copyrights text at the bottom of the website. 

It’s very easy to change the text there. We will show you how.

Open the WordPress backend. Navigate to the “Theme Options” and then to “Footer”.

You can configure a few options.

• Copyright Info - Enable / disable copyright info.
• Copyright text - Add text for copyright info at the bottom of the page (the “Copyright Info” button must be set as “On”.)
• PixelEmu copyright - Enable / disable PixelEmu copyright.

After modifying settings click the "Save changes" button.

How to manage the Why Us section?

The "Why us" section is displayed using the Image and PE Best Features widget. We’ve added the big image on the left, focused on the WordPress theme's subject.

Best Features widget is used on the right side. It’s a simple widget that gives the possibility to display icons with their names and descriptions.
Choose between various styles and layouts. Our example shows off icons and a text description below them.

The left side displays a normal media image. We used this to show the whole why us section in an attractive way.

How to configure the Best Features widget?

Navigate to “Appearance” -> “Widgets”. The Best Features widget you can find on the list there.

The next step required to add the widget to a chosen sidebar.

Let’s see the widget box most important options (configured for our demo example):

The first thing is the main widget title. Under the title, you can find all the icons previously created on our example (items). Each item can have a title, url link, icon class (font awesome class), and additional text if needed.

Here is the second part of the options:

You can choose a style (two styles are available), upload the image (we didn’t use this option on the demo site), write the description that appears below icons. If you uploaded the Image then choose the layout (five variants are available), the image size, and the type of animation from the list (along with its delay).

How to change menu links in the footer section?

The footer section of your website can contain links to the website pages of your choice. Guest users browsing the website will see the footer if they scroll to the bottom of your page.

You should consider setting certain pages to be only accessible from the footer. Pages with legal information like Terms & Conditions are often linked only from the footer.

Footer links should be easy for the user to scan and allow him to locate what he is looking for.
It is also recommended to group the footer links into sections that are clearly separated visually, semantically divided.

As you can see in our Eco Energy demo example, in the footer section, there is a set of links (including Rules, Blog, How to use, Privacy policy ) directing to various places on the website.

There are different types of links that can be used in the footer. The chosen type most often depends on the purpose of the link.

Some examples:

• The link directing to the blog, you can connect with the posts page.
• The link to the rules can be a custom link.
• You can also link the menu item with a category, single page, or even a testimonial.

What’s important, to link an item menu somewhere, the content data must already exist. So we attach the links to the ready content :)

Once you have the content you want to link in the footer, navigate to “Appearance” -> “Menus”. Then, you can choose the type of links from the “Add menu items” section and click the “Add to Menu” button.

As you see in the image below, you can add a menu item using ready pages, posts, and testimonials. 

How to manage the contact form?

The contact form on the Eco Energy demo site looks like this:

Let’s see how to manage the contact form.  

Gathering contact details

Open your WordPress admin panel and navigate to “Theme Options” -> “Contact.”

There are many options to use - contact details that can be displayed on the Contact Page or with a Contact widget as well.

All options are in one place, while turning on selected sections, options for a given section will appear. For example, if we enable the google map feature, options such as latitude, longitude, and zoom will appear.

• Google Map - Enable / disable google map (Google Maps API must be enabled. Please check Advanced tab.)
• Latitude - Provide google map latitude. 
• Longitude - Provide google map longitude. 
• Zoom - Provide google map zoom level.

• Tooltip  -  Show tooltip with address / coordinates.
• Tooltip content - Provide text that will be displayed in the map tooltip.

• Contact form - Enable / disable contact form.
• Email recipients - Provide an email address that will be used to receive messages.

• Consent 1 - Require consent 1 to send the form
• Text for consent 1 label (HTML allowed) - provide the constent content
• Consent 2 - Require consent 2 to send the form
• Text for consent 2 label (HTML allowed)  - provide the constent content

• Spam protection - Enable / disable spam protection. ("Google reCaptcha API must be enabled. Please check the Advanced tab.")

• Contact details - Enable / disable contact details. 
• Contact address  - Here you can provide the address. Shortcodes, links, and media attachments can be used.

How to display the contact form?

As mentioned above, you may create a menu link and assign it to the Contact page or display the context form using the Contact widget. 

Displaying the contact form with the Contact widget.

First, let’s find the contact form widget. Navigate to Appearance -> Widgets and find the PE Contact widget on the list. Add it to the widget position you want to place it in.

The widget brings a few options. You can directly decide on the Appearance of the contact form, choosing which elements will be visible. Apart from the standard widget settings, which are the same as for other widgets (widget size, show widget for, custom widget classes), it has the options necessary for the contact form display:

Under the “title box,” you see the list of elements ( the ones from Gathering contact details section) that can be displayed or not (Show/hide):

• Contact details
• Form
• Consent 1
• Consent 2
• Captcha
• Google map
• Tooltip on map

How to change companies' logos?

Next to the testimonials section, you will find examples of companies' logos. We've used the PE Easy Slider widget for this purpose. Check the view from the front-page. We've used a static view of six logos. But there are many possibilities for a configuration.

Let's see the options of this widget, necessary for the appearance of the slider.

• Title - you can set the title (our example does not contain any)
• Source - Choose between a "Posts" and a "Folder as a source." We set a folder source to display images only. You need to remember to enter here the correct folder name with images to display. We suggest to make the same height for images to make them look good in a row.
• Image Folder - it works for the "Folder" choice. You can decide for yourself in which folder the images will be placed.
• A number of items in a row - our example has three items in each row.
• A number of rows - we've set two rows for our example.
• Navigation - Bullets/Arrows/None
• Interval in ms - ( 0 - autoplay is disabled )
• Pause on hover - yes/no
• Image height in px - ( 0 - disabled )
• Grid Spacing (px)  - this is the space between items.

Read the full step by step guide on our blog: How to properly navigate accordion using keyboard according to WCAG recommendations.

Read the full step by step guide on our blog: How to properly navigate tabs using keyboard according to WCAG recommendations.

Question:

Widgets located in the right sidebar jump under the content on the mobile view. I would like to hide several of them and display other ones on mobile. How can I do that?

Solution:

You may simply manage it using bootstrap classes for the "Custom Widget Classes" setting available in each widget of your WordPress theme. Check below how to find the input to place a specific class:

Simply use the Bootstrap rules and use the class that corresponds to your needs.

Check the table here 3. Responsive utilities

For example:

If you want to display the widget for mobile devices only under 992px resolution you need to enter a class "hidden-lg". 

Another example, if you want to display the widget for devices with a resolution 1200px or above enter a class "visible-lg-block".

Images width and height usually are defined with Image Sizes in WordPress settings, and images dimensions can be modified in Settings -> Media.

Below find an example of large image settings.

NOTE: After modifying height and width remember to regenerate images once again. You may do it with 3rd party addons like Regenerate Thumbnails

The issue:

At the top of the WordPress dashboard, you see the error that says: Theme update: Can't check XML file

Why the issue appears?

A theme includes built-in functionality that checks if there is an update available. This function uses fopen or cURL which are:

fopen - a PHP directive used to open external files, ex. XML files.

cURL - is a library that allows you to connect and communicate via a variety of different protocols such as HTTP, HTTPS, FTP, Telnet, etc. It can be used to open external files. 

If none of these 2 things are enabled on your server you can see this error in your Wordpress dashboard.

How to fix that?

Usually, it's about enabling fopen and cURL on your server.

However, there is no general rule for all hosting providers on how to switch on fopen and cURL. It depends on your hosting provider - search for an article in the hosting FAQ section or contact with hosting support.

Enabling fopen and cURL in php.ini 

If you are a more advanced user you may try to enable fopen and cURL in php.ini file by entering the following code:

allow_url_fopen = On

The general thing to enable cURL is adding code to a php.ini file.

extension=php_curl.dll

Disabling checking for updates

If your hosting doesn't allow you to enable any of these things you can at least disable checking for updates to get rid of the error at the dashboard. Go to Theme Options -> Advanced and find such an option.

Question:

I'm trying to get the FAQ page to display in PE panel widget for School WordPress theme. If I access the FAQ page on the dashboard the template selection shows as FAQ page which should be correct and I have the template FAQs set up already so I’m not sure what the issue is. PE Panels widget displays no content.

Solution:

At first, you need to learn how the FAQ template and PE Panels display content. 

FAQ page uses FAQ template to displays items from the FAQ section, see the image below: 

How to set the FAQ template?

If you want to set one of the pages to display questions in the accordion-style you need to create a page (or edit an already created one) and set the template FAQ Page in Page Attributes settings. Then the page will display all items created in the FAQ section - FAQ items:

On the other hand, PE Panels is a plugin that displays the content of posts or pages. So in short, it displays the content you enter in the editor:

This means that if you add a FAQ page to display in PE Panels this will not result in displaying FAQ items because PE Panels will try to display FAQ page content which is actually empty.

So if you want to display FAQ questions in the PE Panels you need to put the questions into the page content. We recommend using a simple way for this purpose which is accordion shortcode  - check here the shortcode example of for ACCORDION section.

Question:

Is there a possibility to set the same dimensions for images in the latest posts area? If I load the different sizes for images the news area does not look good.

Solution:

Latest Posts are shown using PE Recent Posts plugin. It can show 3 default WP sizes of images:

The thumbnails only have the option to crop images to make the same size for all images. Other image sizes match image size to its height.

Problem:

I have deleted almost all of the pages that came with the Business WordPress theme. I created a page named "My Page" added some paragraphs in the block editor and tried to set this as my homepage. When I view this page, none of my content is there, all I find is demo content that came with the theme.

Solution:

There are 2 options you need to set to display homepage content you created.

1. Specify the content you want to show in Settings -> Reading

2. Remember that content on the front page can be hidden in Theme Options -> Layout -> Front page content. Make sure it's enabled if you want to display the Main content section in the layout.

Problem:

One of the administrator users did something to the events page calendar, and it does not look like on the original demo site of the School WordPress theme. I was trying to compare setting to the backup site that still works, but I can’t figure it out.

Solution:

You need to check if those setting from the screenshot below are set. If not, do it, to make Events view look like on the original demo.

Customer's question:

The forms for login, registration, and ads posting do not open on the top in the mobile phones but rather they open at the bottom after the widgets, which leaves the visitors asking where is the form thinking that it does not function. I had to direct them personally to scroll down again in other to locate the form.

Solution:

On the mobile, these views on your website are indeed on the bottom because there are unnecessary widgets on the top.

You can assign widgets to specific pages/views using the "AH Display Widgets" plugin.

At the bottom of every widget, you can manipulate assigning it to the selected area as on the screen below: 

Reported problem:

I'm having trouble finalizing the required plugins PE Services & Slider Revolution. I've been able to successfully install and activate all of the other required plugins except the 2 that I mentioned.

I'm receiving a parse error message for the PE Services plugin:

"Parse error: syntax error, unexpected '&&' (T_BOOLEAN_AND), expecting ')' in /public_html/wp-content/plugins/pe-services-plugin/shortcodes/image-gallery.php on line 91"

I'm receiving a Fatal error for the Slider Revolution plugin:

"Can't use function return value in write context in /public_html/wp-content/plugins/revslider/includes/functions.class.php on line 1025"

Solution:

This is an example of one of the WordPress themes. But the WordPress theme does not matter here. Please make sure that your server uses PHP version 5.6 or later. Our WordPress themes require at least PHP 5.6.