CSS

Magento 2: Add Local & External CSS and JS file

This article shows different ways to add CSS and JS files in Magento 2. Add CSS & JS from Layout XML file In this example, we are adding JS and CSS via layout file in your custom module. app/code/YourCompany/YourModule/ view/frontend/layout/frontName_controllerName_actionName.xml <?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <!– local CSS file –> <css src="YourCompany_YourModule::css/custom.css"/> <!– local … Read more

Javascript: Show/Hide HTML elements

Here, I will be demonstrating on showing or hiding a div when a link is clicked. I have done this with Javascript and CSS. I have called showHideDiv() Js function when the link is clicked. The display of the div where content is present, is visible or hidden on each click. For this, CSS styling … Read more

Left or Right Align your image, adsense code or other advertisement in wordpress

Suppose you want to show your google adsense in the top-left side of your post. If you simply put your adsense code in the single post page (single.php) of wordpress then the text of your post will appear below the adsense. To solve this problem, I used stylesheet property called ‘margin’. The example below is … Read more