With themes like OceanWP's Lauren theme that have header background images on pages. Here is where you can change the background image. General Options > Page Title section. The default install image does not show up in the settings which may be confusing but after you change it it will show up in this section.
Updated: Apr 27, 2022 Customizer: Header/Mobile Menu/BreakpointsIf your chosen breakpoint isn't in the dropdown, choose "Custom media query" and enter the pixel value in the Custom Media Query field.
I discovered this problem only on Firefox, where the logo in the header shows at the full high resolution size required for retina or 4K screens. So for instance if your regular logo is 150px and you have a 300px logo for high res screens, Firefox will display the larger logo, breaking your menu and ruining your design. I found out this only happens on certain screen sizes, in my case it was a 1600 x 900px Lenovo laptop. To get around the problem, be sure to set the logo size manually in the Customizer>Header>Logo Retina Logo.
Editing OceanWP Footer Widget Button Link Colors I created a custom footer template in OceanWP using Elementor. I ran into this problem when Elementor Pro was not able to over ride some of the link colors in OceanWP’s footer widgets. PS. You can disable your theme’s ability to override Elementor Pro’s colors by going to Elementor/Settings. Disable Default Colors, Disable Default Fonts. Adding to the problem was a button created in Elementor Pro that had a hover color. To lock in the colors add this to the Wordpress Customizer’s Custom CSS/JS. /* Footer Link Colors */ #footer-widgets a {color:#FA9100} #footer-widgets a.button {color:#282828} #footer-widgets a.button:hover {color:#282828} Elementor Text Editor Widget Not Changing Font Settings Have you ever run into problems with the Elementor Text Editor Widget not being able to change the font size, line spacing etc.? At first I investigated whether there was a conflict with the theme but that didn't appear to be the case. Even setting all fonts back to default and disabling Elementor fonts in Elementor settings didn't work. This tiny piece of css added to Wordpress/Customizer/Custom CSS did the trick. .elementor-text-editor p{ font-size: inherit; line-height: inherit; letter-spacing: inherit; } Force Elementor Pro Button Colors Using OceanWP…
Using OceanWP and Elementor Pro I added a popup button in the footer widget area. Even after turning off theme control over Elementor colors in Elementor>Settings>Disable Default Colors, the text colours were not correct. Here is what I did to over ride any color settings other plugins may be inserting. This may be a bit sloppy but put this in the OceanWP Custom CSS/JS section. /* Footer Link Colours */ a.elementor-button-link.elementor-button.elementor-size-sm {color:#ffffff !important} a.elementor-button-link.elementor-button.elementor-size-sm:hover {color:#282828 !important} UPDATE Well, it looks like I found the problem. Uploading some of the OceanWP Pro templates inserts CSS into the Customizer. Found this when I scrolled up the Custom CSS/JS section so look in the CSS section if you're experiencing color wonkiness. /* Footer */ #footer-widgets .footer-box { text-align: center; } #footer-widgets .social-widget .style-light li a, #footer-widgets .social-widget .style-dark li a, #footer-widgets .social-widget .style-colored li a { background-color: #263036; color: #708e9f; border-color: #263036; width: 40px; height: 40px; line-height: 40px; } #footer-widgets .social-widget .style-light li a:hover, #footer-widgets .social-widget .style-dark li a:hover, #footer-widgets .social-widget .style-colored li a:hover { background-color: #0eb290; color: #fff !important; border-color: #0eb290 !important; }
Add this snippet of code in the Wordpress Customizer/Custom CSS for global changes to all accordions and toggles on the site. To affect only a single toggle or accordion widget go the the Elementor's Advanced tab's Custom CSS. This will open all toggle and accordian items when a page loads. .elementor-toggle .elementor-tab-content { display: block !important; }
So you want to change the spacing above or below a post's title. Where does OceanWP hide the settings? See below. (Customizer/General Options/Page Title)
OceanWP's page layout section is located here in the Customizer. WP admin dashboard > Appearance > Customize > General Options > General Styles > Pages Full width and boxed layout is pretty much self explanatory but OceanWP has a layout option called Separate that isn't described in the documention. In short the Separate layout makes your content boxed but your header/footer are full width. Hope that saves you minutes of Googling.