How to remove header links in Magento 2

/in , /by

Please follow the below instructions :

Step 1 :- Go to app/design/frontend/VenderName/ThemeName/Magento_Theme/layout/default.xml

Step 2 :- Copy below Code

<referenceBlock name="wish-list-link" remove="true"/>
<referenceBlock name="catalog.compare.link" remove="true"/>

Step 3 :- Paste this code in default.xml before body tag () and save it.

It will remove the links from the header

How to remove compare link on Magento2 header

/in , /by

Step 1 :- Go to app/design/frontend/VenderName/ThemeName/Magento_Theme/layout/default.xml

Step 2 :- Copy below Code

<referenceBlock name="catalog.compare.link" remove="true"/>

Step 3 :- Paste this code in default.xml before body tag () and save it.

It will remove the links from the header

CSS Media Queries for iPads & iPhones

/in , , , , , , /by

Sometimes we got very confusion while developing responsive work. When we apply the breakpoints for iPad and iPhone that does not works properly. As per my experience while searching on the Internet I found some useful information regarding the media queries. I applied those and that works fine for me. So today I am going to add the media queries here for the same.

iPad Media Queries

iPad Media Queries (All generations – including iPad mini)

 

iPad in portrait & landscape


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) { /* STYLES GO HERE */}

iPad in landscape


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) { /* STYLES GO HERE */}

iPad in portrait


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) { /* STYLES GO HERE */ }

Retina iPad in landscape


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2) { /* STYLES GO HERE */}

Retina iPad in portrait


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2) { /* STYLES GO HERE */ }

iPad mini Media Queries

iPad mini in portrait & landscape


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1) { /* STYLES GO HERE */}

iPad mini in landscape


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 1) { /* STYLES GO HERE */}

iPad mini in portrait


@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 1) { /* STYLES GO HERE */ }

iPad mini Resolution


Screen Width = 768px (CSS Pixels)
Screen Height = 1024px (CSS Pixels)

Screen Width = 768px (Actual Pixels)
Screen Height = 1024px (Actual Pixels)

Device-pixel-ratio: 1

iPhone Media Queries

iPhone 6 Media Queries

iPhone 6 in portrait & landscape


@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px) { /* STYLES GO HERE */}

iPhone 6 in landscape


@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : landscape) { /* STYLES GO HERE */}

iPhone 6 in portrait


@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : portrait) { /* STYLES GO HERE */ }

How to Change Magento 2 Favicon

/in , /by

Today I will show you how you can change favicon on magento2 site. Follow the below steps :

1- go to Content -> Design -> Configuration
2- Click on HTML Head settings tab
3- Upload your favicon and save configuration.
4- Refresh the Cache

How To Get Base, Media, Link Url In Magento2

/in /by

To get URL in magento2, you have to first create instance of \Magento\Framework\App\ObjectManager to get current store:

$_objectManager = \Magento\Framework\App\ObjectManager::getInstance(); //instance of\Magento\Framework\App\ObjectManager
$storeManager = $_objectManager->get('Magento\Store\Model\StoreManagerInterface');
$currentStore = $storeManager->getStore();

To get base URL:

1
2
3
$baseUrl = $currentStore->getBaseUrl();
//Output link will be like this:

To get media base URL:

1
2
3
$mediaUrl = $currentStore->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA);
//Media url output link will be like this:

To get link base url:

1
2
3
$linkUrl = $currentStore->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_LINK);
//Output link will be link this:

How to Enable Template Path Hints in Magento 2

/in /by

Steps to turn on template path hints in Magento 2:

Go to Magento 2 admin panel and login with your credentials.
Go to Stores –> Configuration.
Select Developer option from the Advanced tab at the end.
Open Debug dropdown and set Enabled Template Path Hints for Storefront to yes.

Click to Save Config.

How to Change Magento 2 Logo

/in /by

Here are the steps that you will follow to change Logo in Magento 2

Go to your Magento 2 admin.
Go to STORES > Configuration > Design > Header
Click Choose file and select your logo
Click Save Config