OceanWp Theme Tips

How To Display Tags on WordPress Pages With OceanWP Hooks For SEO

Read more about the article How To Display Tags on WordPress Pages With OceanWP Hooks For SEO

OceanWP allows you to position a post's tags in different places in the Customizer's Single Post section by dragging the Tags Element position. For SEO purposes I usually put it near the end of the post. Google recognizes tags as keywords on a page and for articles where it's difficult to fit the keyword in the content but still want to include a valuable keyword, tags are a great way to do it. You can see a page using this technique on an automatic pool cover cost page I created. It's the code at the very bottom of the page with TAGS in caps. Also, for less competitive keywords tag and category pages can show up in the serps. Make sure there are text excerpts included in these archive pages so Google can recognize there is some content. Here is a quick step-by-step guide will walk you through the process of installing and configuring OceanWP with a simple Wordpress tags plugins and a php code snippet to display tag links on your WordPress pages for SEO. Step 1: Install the "Pages with Category and Tag" Plugin Log in to your WordPress dashboard. Go to "Plugins" > "Add New". Search for…

Continue ReadingHow To Display Tags on WordPress Pages With OceanWP Hooks For SEO

Header Search Icon Colors

Read more about the article Header Search Icon Colors

Ever have problems setting the color for the header search icons? Normally, search box setting are in Customizer > Header > Menu > Search Icon. However, the icon colors need a little bit of css. Try the following and change the colors to your preference. #site-header i.icon-magnifier { color: #fff; } #site-header i.icon-magnifier:hover { color: #ffff19; } Source: Auto Draft

Continue ReadingHeader Search Icon Colors

Setting OceanWP Full Screen Blog Layout Margins

Read more about the article Setting OceanWP Full Screen Blog Layout Margins

I discovered a problem when setting up a new site with OceanWP when setting pages to full screen layout via Customizer > Blog > Single Post. The sides, top and bottom had margin of 0 by default. The Customizer settings don't allow you to set margins. I had to insert this piece of css in Customizer > Custom CSS/JS. .single-post.content-full-screen .content-area { max-width: 90% !important; margin: 35px auto !important; } The margin: 35px sets the top and bottom margins.

Continue ReadingSetting OceanWP Full Screen Blog Layout Margins

OceanWP Tips:Quick Reference Guide

Read more about the article OceanWP Tips:Quick Reference Guide

Demo Templates | Headers | Styling & Colors | Layout & Design | OceanWP Widgets | Woocommerce Settings | Misc. OceanWP Settings OceanWP is robust theme with plenty of options and customizability but it's settings in the Customizer aren't always the easiest or most intuitve to find. Occasionally, a bit of custom CSS is needed nudge OceanWP to do what you want. I have been using the theme for several years and created this cheat sheet of notes and CSS examples as a handy reference to help make the changes I want quickly. Oceanwp Website Demo Themes Tips First Customizations To A New OceanWP Demo Site Here are the exact places to edit changes to the default settings immediately after installing a new OceanWP demo Template. MENU COLORS Edit Menu colours first when customizing a theme via the Wordpress Customizer. Header > Logo Header > Menu (main colour changes are here) Typography > Main Menu BODY COLOURS & FONT STYLES General Options > General Styling Typography > Body (OceanWP default font is Open Sans) Typography > Main Menu MENU POSITIONHeader > Menu HIDE THE OCEANWP PAGE TITLE ON TOPAppearance > Customize > General Options > Page Title and set the…

Continue ReadingOceanWP Tips:Quick Reference Guide

Set Number Of Words In OceanWP Category Or Other Archive Pages

Read more about the article Set Number Of Words In OceanWP Category Or Other Archive Pages

In WordPress, the number of words displayed on category or other archive pages can be set in a few different ways. If there is content in the Wordpress Excerpt field, that content will be used. In OceanWP, the number of words displayed can be set using the Excerpt Length slider in the OceanWP Customizer > Blog > Blog Entries section. This allows you to control the length of the excerpt displayed on archive pages, giving you the ability to customize the amount of content shown to your users. Wordpress' default is 55 words for archive pages.

Continue ReadingSet Number Of Words In OceanWP Category Or Other Archive Pages

Changing OceanWP Header Social Icon Colors

Read more about the article Changing OceanWP Header Social Icon Colors

OceanWP's header gives you the option to enable the social menu in the Customizer. Customizer > Header > Social Menu There are 4 styles under Social Link Style. Simple Colored Minimal Dark Unfortunately, the Colored option are preset and you cannot change it in the interface. BEFORE AFTER That's where a bit of CSS can change the colors to your preference. Go to Customizer > Custom CSS/JS and add this bit of CSS. The outer circle color and the inner icon can have separate colors. Instagram is used as an example here. To change the circle color. .oceanwp-social-menu .colored ul li.oceanwp-instagram a {background-color:#ef00ff !important;} To change center icon color use this bit of CSS. .oceanwp-social-menu .social-menu-inner li a[href*="instagram.com"] ::before {color:#008000 !important;}

Continue ReadingChanging OceanWP Header Social Icon Colors

Force OceanWP To Display Mobile Menu At All Screen Sizes

Read more about the article Force OceanWP To Display Mobile Menu At All Screen Sizes

Do you like the hamburger menu style and want to override the default header menu styles in the Customizer? Customizer > Header > General You can override the display style to always be the 3 vertical bars mobile hamburger icon even on wide desktop screen resolutions. Go to Customizer > Header > Mobile Menu Change the Breakpoints to a 1080p or even 4K screen width if you want.

Continue ReadingForce OceanWP To Display Mobile Menu At All Screen Sizes
Older Posts