OceanWP-How To Change Header Menu Styles

Updated: Apr 26, 2022 OceanWP has some default menu stylings built into the header and demo themes typically use one of these as defaults. Unfortunately, it's not available in the obvious Menu setting but in Header/General/Style setting. To change header menu styling, you may need to set the style in Header/General/Style. Menu Options:Minimal:white background with horizontal menu, social icons top right cornerIn Minimal Style: To adjust top padding of menu adjust Header/General/Height (px)Transparent:transparent bg, menu horizontal, social icons top right cornerTop Menu:white bg, menu at the very top with Logo above or belowFull Screen:logo left, hamburger menu on rightCenter:white bg, center text menu and logoMedium:white bg, search box top left, logo, social icons all on top. Second row is menu in light grey.Vertical is a hamburger slider bar on left or right.Custome Header:set in in library FOR DROPDOWN MENU STYLING You can style your menu dropdown in the customizer section. Go to Customize > Header > Menu > Dropdown Styling and set background color with transparency. For the font setting, go to Customize > Typography > Main menu – Dropdown TO CUSTOMIZE MENU SOCIAL ICONS & URLS Customize/Header/Social Menu TO PREVENT TOP MENU HEADER FROM SHRINKING WHEN SCROLLING This is…

Continue ReadingOceanWP-How To Change Header Menu Styles

Centering An OceanWP Footer Widget Examples

CENTERING OCEANWP FOOTER WIDGETS Icons may not align. Centering Social Icons #footer { text-align: center; } #footer .owp-social-share li { float: none; display: inline-block; } #footer-widgets .footer-box .widget-title { border: 0; padding: 0; } Centering Contact Info Widget #footer { text-align: center; } #footer .widget-oceanwp-contact-info li { float: none; display: inline-block; } #footer-widgets .footer-box .widget-title { border: 0; padding: 0; } Change border color of contact icons. #footer-widgets .contact-info-widget i {border-color:#000}

Continue ReadingCentering An OceanWP Footer Widget Examples

Getting Rid of the Credits Link in OceanWP

On some of the OceanWP demo themes, even the pro ones there may be dead links to spammy sites. To get rid of the credits link... Go to Wordpress' Appearance > Menus and look for Footer Menu. Delete the credits link or add your own links. If you do not want to display the menu at all  you can uncheck Footer in Menu Settings/Display Location. Alternatively, in the OceanWP Customizer/Menu just turn off Footer checkbox. PS. If you are trying to center the footer copyright across the whole width of the page, displaying the footer menu will not allow you to do that. To center the copyright menu switch off the footer menu.

Continue ReadingGetting Rid of the Credits Link in OceanWP

OceanWP Quick Notes, Access Common Settings

TOPBAR Top Bar, turn off top bar above Header = Top Bar/General Turning off Top Bar in OceanWP/Theme Panel/Customizer Sections will get rid of all colour and other settings for the top bar. Top Bar Dropdown Menu Colors For Topbar menus: links can ONLY be 1 color, including dropdowns Top Bar/General/Link Color Use Header/Menu/Dropdowns Styling for dropdown background colors Colour, Link Colours: Customize/Top Bar/General Background & border colours. Small social icons on Top Bar. Customize/Top Bar/Social OceanWP Customize/Top Bar code, adds icon and phone number <i class="icon-phone" style="margin: 0 7px 0 0; color: #0a3069;"></i> 1-555-645-324 <i class="icon-clock" style="margin: 0 7px; color: #0a3069;"></i>Monday - Sunday 10:00 - 22:00 HEADERS Site Name, Domain name URL link colours: Header/Logo  Color:Color: Hover Background Colour = Header/General Header Padding = Header/General Header Background Image = Header/Header Media Header Menu link colours, underline (can override general settings),effects = Header/Menu Header Search = Header/Menu To put menu in header. Customize/Menus/ Header Menu Font styles = Typography/Main Menu Header Menu dropdown menu height = Typography/Main Menu:Dropdowns Header Menu colour settings = Header/Menu The Main Styling section controls the colors for the very top of the menu buttons. The Dropdown Styling section controls colors for dropdowns only. Header Height/Menu Position…

Continue ReadingOceanWP Quick Notes, Access Common Settings