Elementor Pro Tips

Using Only A Single Page From An Elementor Web Kit

Read more about the article Using Only A Single Page From An Elementor Web Kit

Using Elementor Kit Single Pages If importing a kit, Elementor can import header, footer and 404 pages. Go to:Elementor /Templates/Kit Library Click View Demo/ Overview (to view separate pages) Click Apply KitCustomize to choose what you want Choose between:templates or content or settings (AVOID SETTINGS if importing to existing site) TEMPLATESSaved Templates, Headers, Footers, Archives, Single Posts, Single Pages, Search Results, 404 Error Page, Popups, Global widgets. If importing headers and footers, you will need to switch back to your default footers. If in OceanWP, turn off the Elementor one (make display rule, exclude display on all pages) for header or footer. IF IMPORTING ONLY TEMPLATESIf choosing just Templates, you can choose Header, Footer and Error 404importing only templates imports the new headers, footers and 404's into the Theme Builder.Parts will show then up in Elementor Theme Builder click All Parts on top. Will mess with existing headers and footers!!!!! CONTENTElementor Pages, Landing Pages, Elementor Posts, WP Pages, WP Posts, WP Menus, Custom Post Types BUT NO HEADER OR FOOTERIf importing content it will import new pages, reset home page back to existing one. Delete new pages you don't want. CUSTOM POST TYPE SETTINGSSite Settings will be affected if importing…

Continue ReadingUsing Only A Single Page From An Elementor Web Kit

Edit OceanWP Blog Grid Elementor Widget Buttons

Read more about the article Edit OceanWP Blog Grid Elementor Widget Buttons

Currently there is no setting to change the text and button size in the OceanWP Blog Grid Elementor Widget. However, you can make those changes by editing CSS in the Elementor widget's Advanced > Custom CSS tab. You can insert this css there. selector .overlay-btn {position:absolute; left: 50%;min-width:200px; padding:16px 12px; font-size: 18px; }

Continue ReadingEdit OceanWP Blog Grid Elementor Widget Buttons

Find Elementor Custom Fields In Elementor Kit Library Templates

Read more about the article Find Elementor Custom Fields In Elementor Kit Library Templates

Elementor's Kit Library templates are well designed and can be a great way to jump start a new site. However, not all their editable components are explained from what I can find. I will be using their Luxury Hotel kit for this example. The Single Room templates are found in the Elementor Theme Builder. Click The All Parts filter in the top left column. From here click on the Single Project template. This will control the look of the individual room template. You will notice the each room page have a different room size under the page title. There is a price field further down the page as well. Those are custom fields Elementor inserts into Wordpress. If you're wondering where those fields are for each room, you can access Wordpress's custom fields for each post by turning on the section in Preferences. After that you will see the custom fields in a panel at the bottom of the editor. Aliquam dignissim lacinia tristique nulla lobortis nunc ac eros scelerisque varius suspendisse sit amet urna vitae urna semper quis at ligula. Mark WolfWeb Designer Aliquam dignissim lacinia tristique nulla lobortis nunc ac eros scelerisque varius suspendisse sit amet urna vitae…

Continue ReadingFind Elementor Custom Fields In Elementor Kit Library Templates

Using OceanWP With Elementor – Tips

Read more about the article Using OceanWP With Elementor – Tips

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…

Continue ReadingUsing OceanWP With Elementor – Tips

Elementor – permanently open all Elementor toggle and accordion widget items

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; }

Continue ReadingElementor – permanently open all Elementor toggle and accordion widget items

Elementor Text Editor Widget Not Changing Font Settings

Read more about the article 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; }

Continue ReadingElementor Text Editor Widget Not Changing Font Settings

Elementor Pro For Developers

Where to find common features for developers new to Elementor Pro. Custom CSS:In Advanced tab of selection widget Theme Builder Options: Go to Wordpress Dashboard/Templates (under Elementor) You can create custom Headers, Footers, Single Page and Archive templates. To use existing blank templates built into Elementor Pro: Dashboard/Templates/Add New Watch out for confusing templates organization in Elementor. You won't be able to see all available templates under Theme Builder or Saved Templates. To view ALL available template types:Dashboard/Templates/Add New then close the popup without creating a new template. That will take you back to the Wordpress dashboard where you can then see all the available templates in the My Templates page including Global Widgets and Sections. Section Blocks Can be Saved As Templates Blocks hold widgets inside. Blocks containing customized widgets can be saved as templates. For instance a Block with multiple images and text blocks customized and arranged for sales items can be saved as a template. Right click the center icon with 6 dots at the top of the Block to "Save as Template". Custom Global Widgets Can Be Created You can customize an existing widget such as the text widget and then save it as a Global Widget…

Continue ReadingElementor Pro For Developers
Older Posts