OceanWP is a fast loading WordPress theme that has great support for third-party plugins and drag and drop page builders.
Its theme demo system allows you to transform your website into something completely different at the click of a button.
The design is extremely popular. The free version of the theme is activated on over 300,000 websites and has a near-perfect 5 star rating on WordPress.org.
Out of the box, OceanWP offers a lot of great functionality. Features can be extended further by a host of free and premium plugin extensions. Additional theme designs are also available to those that upgrade to the OceanWP Core Extensions Bundle.
In this article I would like to show you what OceanWP offers and how you can use it to build a professional looking website.
The Multi-Purpose WordPress Theme
OceanWP is a modern WordPress design that adheres to modern design standards. The design is responsive and has support for multiple languages.
WooCommerce integration is fantastic, with many WooCommerce tweaks built directly into the website. For example, the design has a shopping cart pop up and shopping cart floating bar. There is also a quick view mode that lets a customer see a product without leaving the page.
A common problem for non-designers like myself is that it can be hard to change a WordPress theme beyond its initial design. Sure, I can change colours and fonts, but WordPress themes do not always make it easy to modify the overall structure.
This is not an issue with OceanWP as you can choose from many high professional WordPress designs. These designs can be imported into your website using their theme demo system.
The quality of theme demos is high.
Whilst all designs can be used for a variety of website types, most were designed for a specific purpose such as an online shop or a corporate website.
There are over 20 plugin extensions available for OceanWP. These extensions can be used to add more styling options, additional widgets for page builders, new custom post types, and more.
The premimum extensions can be purchased as a bundle or on their own at $9.99 per year.
If you are using an older WordPress theme, you might find that the stylish pages you created with a drag and drop page builder such as Divi are being squashed into a small canvas area in the middle of the page.
Thankfully, OceanWP was created with page builders in mind.
On each page you can define whether sidebars, headers, and footers, are displayed. You also can control other important page settings such as the logo and margins.
This level of control means that you can tailor each page accordingly and ensure the website structure and website content are in harmony.
Whilst there are 13 premium plugin extensions available for OceanWP, as you shall see, there is a generous amount of functionality available to WordPress users free of charge.
Installing OceanWP & Recommended Plugins
OceanWP can be downloaded from WordPress.org or directly from the themes page in the appearance section of WordPress.
Once you have activated OceanWP, you will see a message that recommends you install three WordPress plugins: Elementor, Ocean Extra, and WP Forms.
The developers should really stress that Ocean Extra is a required plugin, not a recommended plugin. Vital theme functionality, such as the OceanWP control panel, will not be displayed unless Ocean Extra is activated.
It is commonplace now for plugin developers to take users to a splash page after activation or display a welcome message at the top of each page.
I do appreciate why developers do this, but when multiple WordPress plugins are activated at once, the user can be overwhelmed.
I found this to be the case with OceanWP when I activated Elementor, Ocean Extra, and WP Forms, at the same time.
After activating the recommended plugins, I was redirected to the getting started page for WP Forms. The WP Forms welcome page caused the page to look a little messed up.
Even after moving to another page on my website, I was still bombarded with messages. I was advised to run the setup wizard, download the Ocean Sticky Header extension, opt into anonymous plugin data collection for Elementor, and leave a rating on WordPress.org for OceanWP.
As I said, it is overwhelming.
I fully support functionality such as page building and contact forms being added to a theme through the use of plugins. There is no need to reinvent the wheel so enhancing functionality through plugins is nearly always the best route to go down.
I do believe, however, that the developers of OceanWP need to improve this part of the installation experience for the benefit of new WordPress users.
Setting Up Your Website
The OceanWP setup wizard will help you get started with the theme.
The free Ocean Extra extension has to activated in order for the setup wizard to be available.
On the next page you can select the website design you want to use.
All 13 free demos can be previewed and then installed from this page. If you prefer, you can skip this step.
I chose to import the travel demo.
I was then advised to import content into a fresh WordPress installation. A WordPress database reset plugin can be used to clear your database; such as WP Reset, Advanced WordPress Reset, or Reset WP.
Several plugins were marked as required on this page too. In addition to the recommended plugins I activated earlier, I was told to also install the free plugins Custom Sidebar and Social Sharing.
Bizarrely, two premium plugins, Sticky Header and Elementor Widgets, were also marked as being required. I was surprised by this as the travel demo is free to install.
These two plugins retail at $9.99 per year each. They are not expensive, but I do not believe any free demo design should require a premimum plugin in order to work correctly. It comes across as a sneaky way to force users to upgrade.
Thanlkfully, you can skip to the next step without installing them. This does mean, however, that the final output will not match what the theme preview looked like.
At the bottom of this page you can also confirm what data you want to import during the import process. All options are checked by default.
In the next page you can customise essential settings for your website such as the logo, website title, and tagline.
This page also lets you select the default colours for your website design and links.
By default, all colours are greyed out, so you need to select each colour from the colour picker. I would love to see preset colour schemes available at this stage so that non-designers like myself have a starting point.
On the next page you will be asked to sign up to the OceanWP email list in exchange for a bonus video. You can skip this and visit your new website design.
I was initially impressed with how good my website looked after importing the demo, but when I delved a little deeper I was a little annoyed.
The first thing I noticed is that my website navigation menu did not stay fixed because I had not purchased the premium Sticky Header extension.
On closer inspection, my website home page was mostly bare because I had not installed the premium Elementor Widgets extension.
The Elementor Widgets addon includes a blog grid widget for displaying blog posts. Without access to this functionality, I was unable to publish the nice grid of posts I had liked in the travel demo.
Overall, I believe the setup wizard is a good thing. Beginners will find it a big help when initially setting up their website with OceanWP.
The whole point of a setup wizard is to simplify the process of getting started. In that regard, I believe the setup wizard should be built directly into the OceanWP theme itself instead of requiring the OceanWP plugin to be activated. This would improve the installation process for beginners. The developers could recommend WordPress plugins during this phase too to better explain the benefits of each plugin. It would make more sense doing it this way as the setup wizard already contains a page that asks for plugins to be installed.
A bigger problem is that free theme demos require premium extensions in order to function correctly. That is something that has to be changed.
After importing the travel demo I checked the plugin requirements of all other designs and discovered that all free theme designs require premium plugins to work correctly. Every single one. Many theme demos required as many as four premium plugin extensions to be activated for the user to recreate the design they previewed.
For some designs, all you will lose is the functionality to use a sticky navigation menu, but for others you lose important theme elements.
I would like to see the developers address this issue and modify the free theme demos so that they are 100% free to use.
Customising Your OceanWP Website
Once Ocean Extra has been activated, the theme panel menu for OceanWP will be displayed in your admin menu. It is entitled “Theme Panel”, however I feel “OceanWP” is more appropriate.
The main theme panel page lets you enable and disable sections from the WordPress theme customiser. I suspect that most people will keep all sections enabled.
Underneath you will find links to important settings in the customiser such as uploading your logo and modifying your header.
The setup wizard can also be run again from this page.
Integrations with third-party services can be found in the integrations tab.
If no plugin extensions are activated, you will only see integration options for MailChimp.
OceanWP has its own templating system. You can create new templates using the WordPress visual editor and re-use them at any time using a shortcode.
This is useful if you are inserting the same content into posts and pages frequently.
For example, you could create a template for your newsletter or for a promotion. You can then insert the offer into new posts and pages by simply adding the shortcode. This can prove to be extremely useful as it means that content that is used frequently can be modified in one central location and update hundreds of pages.
One of the lesser known features of OceanWP is also one of my favourite.
In the scripts and styles page you can enable and disable dozens of Javascript and CSS elements. Disabling features you do not use will help you reduce the overall size of your pages, which in turn speeds up your page loading times.
All theme settings can be exported in a .dat file. This is useful if you want to backup your preferred settings or need to transfer OceanWP from a test environment to a live website.
The styling options and website settings that are configured through the setup wizard can be modified through the WordPress theme customiser.
Previously, users had to install the Demo Import Extension plugin in order to import demos into their website. This functionality has now been transferred into Ocean Extra on the “Install Demos” page.
“All free demos have been incorporated to the latest version of the Ocean Extra plugin, so the Ocean Demo Import plugin can be removed from your website.”
The process is identical. You will see a list of the “Free” demos that are available to install. There is a preview available for each demo and clicking on a design will show you what plugins are required for it.
In total OceanWP offers 13 free demos and 21 pro demos.
There is no denying the quality of these designs. All designs, free and premium, have been created to a high standard. Without doubt, it is one of the best features of OceanWP, as it allows you to tranform your website into something special.
Please check out the main demos page on OceanWP to get a better feel of the standard of OceanWP’s demo designs.
The last page in the theme panel is a promotion for OceanWP premium extensions.
An OceanWP settings area can be found under the WordPress visual editor for all posts, pages, and custom post types. Any settings that are defined here are specific to the page in question and will not be applied to other pages on your website.
The number of options available in this settings box is fantastic.
As noted earlier, you can disable parts of the design such as the header, footer, and sidebars. You can also change the header style.
Shortcodes can be inserted before and after key parts of your pages and you can change the logo and the navigation menu that is used.
These settings can be useful when branding specific areas of your website. For example, if you have a documentation area in your website, you could upload a logo with different branding and link to key documentation directly from the main menu.
Titles can be completely changed. You can change the title, sub-heading, and the styling of the title. Alternatively, you can disable it altogether. You can customise breadcrumbs and your footer in a similar way.
Unique post format options are also available for audio, video, links, quotes, and more.
Being able to customise each page on your website as you want makes OceanWP very powerful. The possiblities are limitless.
Using the Theme Customiser
The vast majority of settings and styling options can be found in the WordPress theme customiser.
Any changes you make here can be previewed in real-time for desktops, tablets, and smartphones.
The general settings section is where many important website settings are located. From here you can change the styling of your website design, change the layout style for main areas of your website, and control pagination.
Typography can be modified for every element on your website, but the area which stands out for me is the header section.
Most theme demos have several header styles. Colours, padding, margins, and more, can be changed with ease. Large image and video banners can be uploaded for your header to make your website stand out.
The options available for your blog are fantastic too. You can use large images, thumbnails, or a grid layout. Blog elements can enabled and disabled at the click of a button.
The footer section lets you define whether it is displayed on tablets and smartphones and you can create your own copyright message with the aid of shortcodes.
We are seeing more and more theme developers embrace the WordPress theme customiser instead of using a traditional options page that is powered by an options panel such as Redux Framework. This suits me just fine.
The theme customiser is not always the quickest way of making website changes, but it is a small price to pay for being able to see modifications as you make them.
OceanWP Core Extensions
The core functionality of OceanWP can be extended through the use of plugin extensions. At the time of writing there are 20 plugin extensions and seven of these are free to download. The OceanWP website still lists the now defunct Demo Import extension, which is why it says there are 21 plugin extensions.
The seven free extensions are Stick Anything, Modal Window, Posts Slider, Custom Sidebar, Product Sharing, Social Sharing, and of course, Ocean Extra. All of these plugins can be downloaded from WordPress.org or directly from your WordPress admin area.
You will be familiar with Ocean Extra already. This plugin extension is necessary for importing theme demos, the theme panel, scripts and styles, and more. This plugin should be designated as required or the functionality should be built directly into OceanWP.
Stick Anything is a simple plugin that allows you to stick a particular CSS element to your page. This could be used for logos, forms, and more.
Modal Window can be used to add content to a modal window and display the button wherever you want.
Posts Slider lets you display your blog posts in beautiful slides. You have full control over the size of thumbnail images used, the number of slides, and speed of slides. You can also limit slides to posts from only one category.
Custom Sidebar is a sidebar manager that lets you create an unlimited number of sidebars. There are many other sidebar plugins available for WordPress, but you may want to give this one a try as you can manage sidebars directly from the OceanWP theme panel.
The Product Sharing plugin allows WooCommerce users to display social media sharing buttons under products.
If you want to add sharing buttons underneath blog posts, you need to use Social Sharing. The plugin supports several social media services including Twitter, Facebook, LinkedIn, Google+, and Pinterest. I was pleasantly surprised at how nice the sharing buttons were in this plugin.
The free plugin extensions that are available for OceanWP are OK, however apart from OceanWP Extra, they are not really specific to OceanWP.
Therefore, if you are looking to add slides, or custom sidebars, or social media sharing buttons, you may want to look at better alternatives that are available for WordPress.
OceanWP Premium Extensions
13 premium plugin extensions are available for OceanWP.
The extensions are Full Screen, Cookie Notice, Popup Login, Instagram, White Label, Portfolio, Woo Popup, Sticky Footer, Ocean Hooks, Elementor Widgets, Side Panel, Sticky Header, and Footer Callout.
The developers have priced each extension competitively. Each one retails at only $9.99 per year.
If you add an extension to your cart, you will be encouraged to take advantage of the OceanWP core extensions bundle that includes all premium extensions. The personal license for this bundle normally costs $39.99 per year, so make sure you click to buy an extension on its own to save yourself $5.
In addition to all core extensions, the bundle gives you access to 12 months of support and updates and access to 21 pro demo designs.
All three license options give you access to the same content, however usage is increased when you spend more. The business license at $79.99 per year gives support and updates for three websites and the unlimited license at $129.99 per year completely removes usage restrictions.
The premium extensions can help you do many different things.
Full Screen enables you to create a fullscreen scrolling website. The scrolling speed and navigation colour can be adjusted to help you present content as you wish. You need Elementor to be activated in order to use this extension.
Cookie Notice will inform website visitors of the fact you are using cookies to comply with EU cookie law GDPR regulation. It comes with two styles and you can change the text that is displayed to users.
Photographers who use Instagram will appreciate the Instagram plugin that pulls images from your account, however if you looking to display images on your website, you may also want to consider Portfolio.
The portfolio plugin extension helps you display a portfolio of images using a page template or shortcode. It allows you to modify the styling and typography of the portfolio and you can filter content by categories, tags, and more.
Developers will love the Ocean Hooks extension. You can use this plugin to insert PHP code and shortcodes into any area of your website.
Hooks can be activated on a page by page basis and controlled via the OceanWP settings box. There are some fantastic features available for it such as limiting hooks by conditional logic and user roles.
Another plugin developers should look at is White Label. This plugin lets you replace all OceanWP branding with your own.
Whilst OceanWP does play well with all WordPress page builders, its integration with Elementor is a little more refined. If you are using Elementor with OceanWP, the Elementor Widgets is a worthwhile purchase.
The plugin adds over 40 unique Elementor content widgets. This greatly expands what you can create using Elemntor in the canvas area.
There are widgets for design elements, banners, images, forms, WooCommerce products, posts, and more.
Two popup plugins are available for OceanWP.
Woo Popup will display a message to shoppers when they click to purchase an item and advise them that the product has been added to their shopping cart. The plugin lets you modify the size, styling, and content, of the pop up.
Popup Login will load up a form for creating an account, logging in, and resetting a password.
The remaining plugin extensions add additional design functionality.
Side Panel adds a responsive side panel to the side of your page that can be closed by users at any time. You define what widgets are displayed here and how the panel looks and operates.
Sticky Header, which is marked as required in most free OceanWP theme demos, can be used to keep the header fixed at the top of the page. The plugin allows you to determine the height of the sticky header and whether it is displayed on mobiles.
In a similar fashion, Sticky Footer can be used to attach a footer to the bottom of each page.
The last premium extension is Footer Callout. This can be used to display a prominent bar above your footer. Styling can be altered easily and it can be enabled or disabled for specific pages.
Some premium extensions only add a little additional functionality to your website, but others such as Ocean Hooks and Elementor Widgets are quite substancial.
At $9.99 each, none of these plugins are expensive, however I believe that the $34.99 offer for all premium extensions and pro demos is fantastic value for money.
Final Thoughts
Those of you who are looking for a good free WordPress design will appreciate what OceanWP offers.
The theme places most design and styling options in the WordPress theme customiser so that you can see how modifications look in real-time. Beginners will appreciate how much this helps when making changes.
The additional settings that are displayed under the WordPress visual editor can be used to uniquely customise every single page on your website. This opens up a limitless number of possiblities on how you build your website.
Page builders are supported well too as you can disable page elements such as your header, footer, and sidebars, at the click of a button. It is worth noting, however, that OceanWP has better integration with Elementor than other page builders.
I do feel that the developers should improve the installation process of OceanWP for beginners and perhaps add the functionality of Ocean Extra directly into the theme itself; however a bigger concern is the implementation of OceanWP’s free theme demos.
The theme demo system is undoubtedly one of the best features of OceanWP as it gives users access to a catalogue of high quality designs. It is therefore disappointing that every single free theme demo requires a premium plugin extension to work correctly.
In that respect, the full version of OceanWP is a better representation of what OceanWP can do. Each premium plugin extension is competively priced at $9.99 per year, however the personal license that is available for $34.99 is the better buy.
By purchasing the core extensions bundle you will get a full year of support and updates, access to all premium plugin extensions, and access to all pro theme demos.
If you would like to learn more about OceanWP, I recommend installing the free version to see for yourself how it works. You can learn more about the theme, available theme demos, and available plugin extensions, on the official OceanWP website.
Check out their extensive documentation area too. It features video tutorials and written tutorials of every major feature of OceanWP and explains how each plugin extension works.
Used/using OceanWP? Thoughts?