In this section, you will learn how to translate your site into your native language. The theme is ready for localization via .po/.mo files.

Translate the theme using Loco Translate

Loco Translate is a free WordPress plugin offering in-browser editing of WordPress translation files. This is especially useful for translating your WordPress theme or plugins into a language other than the one it originally comes in (which is typically English).

Follow the steps below to install and configure the plugin:

1. Install and activate Loco Translate

Navigate to Plugins > Add New and search for the plugin Loco Translate. From there, select Install Now, and then click on Activate to get the plugin ready for use on your website.

2. Set the site default language

Navigate to Settings > General in your WordPress dashboard. Then, scroll down where the Site Language dropdown menu is.  The language you see at the top of the dropdown menu is the language your site is currently set at. Select your preferred language from the dropdown menu and click on Save Changes.

3. Translate the theme

Navigate to Loco Translate > Themes and click on the active Sway theme.

Notice that the theme is ready to be translated into language defined earlier in Settings > General. Simply click the language link and check with the language editor page.

To start translating, click on the word or phrase you would like to translate.

Beginner’s guide for Loco Translate. This guide will walk you through adding your own translations to a theme.

Manually translating the theme:

1. Download POEdit: https://poedit.net/download
2. Find the folder languages of the theme (wp-content/themes/sway/languages/).
3. Duplicate the sway.pot file.
4. Rename your copy of sway.pot example: fr_FR.po for French, it_IT.po for Italian or de_DE.po for Deutch.
5. Open your file with POEdit software.
6. Translate your file.
7. In File click on Preferences and tick “Automatically generate mo”.
8. Save your file.
9. Upload both .po/.mo files to the theme languages folder (wp-content/themes/sway/languages/) using a FTP client.
10. Navigate to Dashboard > Settings > General and set the Site Language.
11. Check results.

1. Enable Cache

Install and activate a caching plugin. We generally recommend WP Super Cache.

2. Enable CSS and JS Minification

CSS and JavaScript are static files. They will be loaded faster if they’re minified. It’s very simple to automatically minify them. Simply install and activate the Autoptimize plugin.

Go to the plugin’s settings page and enable the three options:
– Optimize HTML Code?
– Optimize JavaScript Code?
– Optimize CSS Code?

3. Improve Hosting Configuration

Ask your hosting provider to do the following for you:
– Enable gzip compression.
– Leverage browser caching.

If your hosting provider refuses to do so, it’s high time to consider changing your service provider.

4. Optimize Image Sizes

Optimize all your images with this Tiny Compress Images. This tool requires an active subscription and it’s free for the first 500 images.

If after all suggestions and practices from the ticket your website load time doesn’t improve then the issue is with your server and you would have to either change your hosting provider or upgrade your hosting package. Unfortunately, we can’t help you much with server optimization and configuration, it is on end-users to increase performance on their own and to make sure that they are using reliable hosting service providers with high resources, and with fast and secure servers.

1. After logging into the WordPress Dashboard, click Pages, then click the Add New button.
2. Enter a title for the page, and then click Publish.
3. Hover over Settings in the WordPress Menu, and then click Reading.
4. In the Front Page Displays section at the top, the Static Page option should be selected.
5. Select your newly created page from the Posts Page list.
6. Scroll down and click the Save Changes button.

MonsterInsights is the most popular Google Analytics plugin for WordPress. Over 1 million websites use it including the likes of Bloomberg, PlayStation, Zillow, and more.

It is the easiest and by far the best way to add Google Analytics to WordPress (for all users beginners and experts).

You can paste your Facebook Pixel code in the header section and click on the save button to store your changes.

That’s all, you have successfully installed Facebook Pixel on your WordPress website.

To disable/enable the comments box for all pages and posts, navigate to Dashboard > Settings > Discussion. Under “Default article settings”, check/uncheck the box next to “Allow people to post comments on new articles” and then click “Save Settings”.

Remember that even though you have disabled comments on all pages, you can still enable them on a page if you want. To do that you need to edit the page where you want to enable comments. On the post editor screen click on the Screen Options button on the upper right corner of the screen. This will open a fly down menu where you need to check the box next to Discussion.

Once you have checked the discussion box, scroll down and you will find a Discussion meta box on the post editor screen. This meta box allows you to selectively enable or disable comments on a single page.

In this tutorial, you will learn how to set up One Page Smooth Scroll links with the main navigation area (Main Menu). Note that these links work on the single page and smooth scrolling is not enabled if you try to scroll down to a section from a different page.

Creating the One Page website structure

When creating content for your landing page website, you’ll need to organize your content into sections. This is so you can reference each section in your menu. Your menu will serve as a way for your viewers to quickly scroll to a section they’d like to view. For example, clicking the About menu item will automatically scroll the page to the About section.

1. Create a new page or edit an existing one.
2. Create your page content and layout using the WPBakery Page Builder as normal.
3. Once you’re finished laying out the page and creating your content, determine the different sections on your page. For example, the About section, the Contact section, and so on.
4. Once you’ve decided on the different sections of your page, it’s time to reference each section. There is an option to add ID to your Row which can be used as an anchor pointer when creating a link.

Important: When adding ID to row please make sure it is a unique value.

Continue adding a row ID for all your One Page website sections. For example, the About us section should use an about-us ID.

Creating the One Page scrolling menu items

Please read below for detailed instructions on how to set up a one-page smooth scroll navigation menu.

1. Navigate to the Appearance > Menus tab on your WordPress admin panel.
2. Click the “Create A New Menu” link. Give it a name, then click the “Create Menu” button.
3. In the left sidebar, expand the “Custom Links” tab.
4. In the “URL” field, enter your website home address and the section ID you’ve assigned to a section on your page. For example, if this menu item links to your About us section, then it would be #about-us. Please note that you have to enter it with a hashtag (#) in order to scroll to the section properly.
5. Once you’ve added the Anchor Name ID to the “URL” field, enter a name for the “Link Text” field. This is simply the menu item’s text. For example, About us.
6. When finished filling in those fields, click the “Add To Menu” button.
7. Under the “Menu Structure” section, you’ll find all the menu items you’ve just created. Expand each menu item and edit it’s settings.
8. Use the following CSS class with the “CSS Classes (optional)” field: scroll-section. This will add the One Page smooth scroll effect on your menu links. If the “CSS Classes” field is not visible you will need to enable it from the “Screen options” tab at the top of your admin page.

   

9. Once you’re done creating your custom menu items, click “Save Menu”.
10. You’re done. Refresh your page and check the results.

Apply smooth scroll effect on a Button Element

You can apply the same smooth scroll effect on a Single Button Element by using the btn-smooth-scroll Extra Class with the Button settings modal.

Installing bbPress

It is recommended that you take a backup before you install bbPress. Please read the the guides below and follow the step by step instructions:

Automatic Plugin Installation

1. Log into your WordPress back-end.
2. Go to Plugins > Add New.
3. You will see bbPress part of the featured plugins and you can install from there, or you can type “bbPress” into the search bar and hit enter to search the plugins.
4. Click Install Now.
5. Now Activate the bbPress plugin.

Manual Plugin Installation

1. Download bbPress from here
2. Go to Plugins > Add New.
3. Click Choose File then choose your the bbPress zip file you downloaded.
4. Hit Install Now, now activate.
5. Now Activate the bbPress plugin.

Configuring bbPress

Upon activation, bbPress will add menu items to the WordPress backend menu. These are:

1. bbPress creates three custom post types and adds them to the navigation menu: Forums, Topics, and Replies. Use these menu items to create and manage your forums.
2. A sub-menu found at Settings > Forums. Customize these settings for greater control over bbPress.
3. The default URL slug of the forum if ‘/Forums’ and can be changed from Forum Root Slug under Settings > Forums

Styling bbPress

bbPress default style is overwritten by our theme in order to look nice and fit the design of the theme. Some styles are fixed but others are dynamic and inherited from the theme options panel. By changing all these options from Sway->Theme options will change bbPress styling too:

• Main Color Theme. Please see Color Schemes article.
• Typography. Please see Typography article.
• Border Radius. Please see Elements article

Make bbPress forum as homepage

1. Create a new page
2. Add the bbPress ShortCode for forum index: https://codex.bbpress.org/shortcodes/  which is [[bbp-forum-index]]
3. Go to Settings/Reading and choose this new page as the default home page (instead of your blog).

Import bbPress dummy data

1. Download dummy data file from here
2. Go to Tools > Import.
3. Go all the way down to where it says WordPress and click the link.
4. If you haven’t installed the WordPress importer plugin already , click Install Now.
5. Click the Choose File button , now select the file you just downloaded before.
6. Click Upload file and import.
7. You can now assign the posts to a specific user of your choice and check Import Attachments
8. Now click Submit

User roles and capabilities

The default bbPress Roles are:

• Keymaster – Can create, edit and delete other users’ forums, topics and replies. Can manage Tags, and moderate a forum with the moderation tools. Has access to global forum settings, tools, and importer.
• Moderator – Can create and edit forums. Can create, edit and delete other users’ topics and replies. Can manage Tags, and moderate a forum with the moderation tools.
• Participant – Can create and edit their own topics and replies.
• Spectator – Can only read topics and replies.
• Blocked – All capabilities are explicitly blocked.

Adobe has great instructions on how to choose custom fonts to use on your personal website in their own documentation.

Head on over to Adobe to choose the custom fonts you’d like added, then follow the instructions below to add those fonts to your website.

Note: after creating your web project, you’ll see your customized HTML embed code. You won’t need it, so don’t add it to your site. Instead, you’ll use the web project ID, which is a shorter set of letters and numbers.

To find the default embed code for your project, visit the Web Projects page, and follow the steps below:

1. Copy the Project ID, which is a string of letters and numbers above the embed code.

2. Login with your Sway website.

5. Navigate to Dashboard > Sway > Theme Options > Typography > Typekit Fonts

6. Paste the Project ID into the Typekit ID field.

7. In the Body and Headings Typography input fields add the font name. For example on our live website we are using the Futura PT font. The body and headings input fields should contain the futura-pt font name.

8. Click Save Changes and preview the results.