/** Theme Name: MyWebsite - AMP Ready Author: MyWebsite.co.za Author URI: https://mywebsite.co.za Description: Drawing from the fastest, fully customizable & beautiful Astra theme - excellent for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, AMP-Ready comes with schema.org code integrated so search engines will love your site. The AMP-Ready theme offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugins to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported to make your site run like a breeze. Looking for a perfect base theme? Look no further. Our AMP-Ready theme is fast, fully customizable and a beautiful theme all round! Version: 2.3.4 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: mywebsite-amp-ready Template: astra */ /* START CUSTOMIZING */ /* * TUTORIAL BELOW: Just about any styling on your site can be altered by adding css code in this document. * * Example of changing a colour: The WooCommerce Demo notification's background colour * If you have WooCommerce installed and active, the notification is activated at Appearance/Customise/WooCommerce/Store Notice. */ .woocommerce-store-notice, p.demo_store { background-color: rgba(66, 100, 217, 0.45) !important; } /* Sometimes your css instruction might be ignored because another instruction for the same styling is already called by a plugin or theme setting with higher authority than this document. * In such a case, you will want to try adding the " !impoortant" tag before ending your line with the ";" * This would usually ensure that your code is regarded as more important than the conflicting instruction by a plugin or theme.*/ /* This is an informational comment. Because it is inside comment tags it is not processed as active code and disregarded by the system. */ /* It is regarded as best-practise to "comment" your instructions, so you or another developer will know what you did here, even after you've forgotten about the change */ /* You can also temporarily disable a command by including it inside the comment tags. */ /* Example: */ /* Start styling of my custom logo display */ .my-custom-logo-display { background: red !important; padding: 15px 15px 15px 15px !important; border-radius: 35px !important; } /* End styling of my custom logo display */ /* ".my-custom-logo-display" is what we call a "class". I created this class using the code above and it is ready to be used anywhere on this website. * Assign this class which I created here, to a logo or other image and see what happens instantly! * You can do this using elementor or any other method (we prefer Elementor!) * Elementor instruction: * Go to pages, hover over a page name and click "Edit with Elementor" * Click on an image within that page, or add an image * Click on the "Advanced" button of the image settings on the left * in the "Custom Class" field, simply add this class name (without the ".") * See the change instantly! (if not instant, then click Update at the bottom left and refresh the page) * Still not working? You might have to clear the cache of the Hummingbird Plugin, or your hosting Object Cache or Static Server-side cache, as well as your browser cache. * Bummer, I know, but these caches cause your site to load superfast for your visitors. * While making major design changes, disable any caches at your hosting or optimization plugins temporarily */ /* Did you know? * This method of creating your styling rules is great for site-wide changes, but here are some drawbacks: * It is time consuming to edit your child theme's files, save it, and reload your pages after changes' * It is also not a permanent solution. * If this was not a "child theme", your settings would be deleted when you update your theme (don't worry, this is a child theme, so that won't happen') * If you change to another theme, your styling in this theme will no longer be active. * EVEN EDITS IN THE APPEARANCE/CUSTOMISE/CUSTOM CSS ARE LINKED DIRECTLY TO YOUR ACTIVE THEME, SO CHANGING THEMES WILL DEACTIVATE THOSE EDITS TOO! * The answer? * To view your changes instantly, and have them active regardless of the theme you are using, create and apply the code directly to the element in elementor. Follow the same steps as with the custom logo styling code above, but also scroll down on the "Advanced" tab and click on "Custom CSS". Add the css code from above, right there in elementor. * * Don't have access to this feature? Find out how to get Elementor Pro, fully licensed at no charge here: https://wa.me/27699527686 * * Now you can change the code in elementor and see the changes instantly, regardless of what theme you are using. * To ensure that css instruction is used everytime you add that image or logo, right click on the image and save it as a "Global widget" or as a "Template", then use that global widget or template everytime you want to insert the same image * * To ensure the code is available site-wide and not only on the elementor page where you added the image, go to wp-admin/elementor/Custom Code and create a new file. * Start the document with the tag * Now assign the page with the condition "Entire Site" and your awesome css styling will be implemented anywhere on your site as soon as you assign the class to an item */ /* Add more custom code below */ /* START DKN CREATED CUSTOM PLUGIN SO IT'S NOT THEME DEPENDENT "Custom Vendor Dash" */ /* END DKN */ /* Start MWS Branding * MOVED TO ELEMENTOR/CUSTOM CODE -> SITE-WIDE STYLE * End MWS Branding - Date 2023-03-29 - 17:41 */