How to build Custom Theme in Magento 2

[@PradeepKalaimaran]

Dheivamae! This is the ONLY complete tutorial I could find on the internet. Thank you so much. Please make more videos!

[@nishanthanr605]

தெய்வமே😂

[@adg9704]

I don't think "logo_img_width/height" work any more. It would be "logo_width/height".

[@hjmmuller6720]

Hello, thanks for the tutorial. May be tehre a problem with newer versions of Magento? 2.4.2 None worked beside theme creation, which was done in one minute: /app/design/frontend/xxx/luma_custom/web/css/source/lib/variables/_navigation.less not overriding /app/design/frontend/xxx/luma_custom/Magento_Theme/layout/default.xml not changing ..none worked. Cleared page cache, generated, preprocessed etc. The logo seems to be changeable only directly in admin

[@hjmmuller6720]

After HOURS of search: you need to write the Theme in capitalized first letter: Instead of: /app/design/frontend/xxx/luma_custom/ take /app/design/frontend/Xxx/luma_custom/ ...its a Magento!

[@MaxPronko]

Nice ☝️ one

[@zargamhussain5481]

I have to create product,attribute,category using rest api in Magento but we have to faces issue while integration if you are intrested please tell me

[@suiteCRMtutorials]

How we copy homepage design of the sample mockup (the Luma theme that's filled with products and homepage block) ? Im sure this would be a pretty educational tutorial.

[@edseljaygavino7670]

how are you able to create those predefined xml file template? I install MagentoWizard but not able to figure how to use it..

[@MaxPronko]

I use phpstorm live template feature

[@shifalikotian9998]

How to install 3party magento theme app and pub theme in ubuntu 18.04

[@naimali6385]

Awesome Video, the way you explain each part. Want to see more stuff continue this series. Thanks

[@NoahNobody]

Any tips for finding block reference names that may be missing from the default.xml, like for example, "Create an Account"?

[@pegatino]

Thanks, What is the difference between this instead of changing the logo from the admin panel?

[@LL-rn8rn]

From Jul, 2019 with Magent2 2.3. The tricks do not work as in the video. 1. After theme changed in the Admin Dashboard, product images are gone in the custom theme. 2. Logo changing doesnt work. ...

[@MaxPronko]

Are you sure you followed all the steps from the video? The theme creation I shared in this video has nothing to do with the Admin Dashboard. If your product images have been disappeared you have to what have happened with either your environment or source code you changed.

[@webmaster3374]

Hi Max in Magento 1, how to fix a theme video play back in video block. (linked from youtube) I have notice the video has stop playing. - The video faded in after the image. Thank you!!

[@infahs870]

Hi, Please suggest which one is good magento 2 or big-commerce . how we can manage the server for magento 2 its not easy task to manage .Please provide the solution and sugesstions

[@MaxPronko]

For the solution I can suggest contacting my Pronko Consulting team, so we can help, email [e-mail]

[@punithbasavaraju4469]

Ia m not getting any changes in my theme after Making changes as you show in above video please help me with this

[@nirmesh44]

your techniques still holds true. awesome video. Please make more such customisation videos

[@unclesteve2526]

Thanks Max, great tutorial! IMPORTANT NOTE: If your newly created theme doesn't show up in the list of themes in Admin area, try this command: sudo php /var/www/html/bin/magento setup:upgrade it worked for me :)

[@MaxPronko]

Hi Stepan, thank you for the tip. I believe it is because of cache as themes are not required to be installed. Thanks for watching.

[@a1shay1979]

hi have a problem with last section on the css, after i delete the frontend + cache + view_preprocessed , i have missing some file so i need to run php bin/magento setup:static-content:deploy again, and after that i can't see the changes i made to the css, you have any idea what is the problem ?

[@kulvindersingh2738]

Hi Max, Can you please shed some light on what is collection in magento, with an example. Thanks

[@KidsawUk15]

I've followed the steps in this video, but when it comes to refreshing the page, it is not showing my changes? What could I be doing wrong? I tried changing the border colour to 'color-pink1' instead of Blue.

[@MaxPronko]

Thank you for your question. It could be different reasons: module is disabled, cache is not cleaned etc.

[@shikharomar334]

nice video max, I want to know how can we fix header position and set z-index in navbar and change logo position to center?

[@MaheshikaWeerasinghe]

A great one! Thanks. Can you please present another tutorial for modifying the product detail page? Something like adding more images and description about the product?

[@er.rupeshkumar2182]

Can you make a complete videos series for magento 2 optimization for bignars so that website can load faster on live server... Thanks

[@rahulmakwana7837]

Hi , how can we override .phtml file of inside custom module in custom theme ?

[@worldcomedystories]

How can make a custom theme with HTML template for Magento 2

[@Gursifatjagdeep]

Plz its request can you tell me about Onbroading in magento like when we work with online shopping website

[@MaxPronko]

Not sure I understand your request. Onboarding for admin user or developer?

[@shikharomar4218]

hi max, nice video and very helpful.. but there is a problem that I can not get any success or error messages after any action like, if I added a product to cart or wishlist or remove , I did not get any messages.. Please help

[@yorki7203]

Tried to change css on v.2.2.4, but didn't work this way. So what helped was to create _extend.less in customtheme/web/css/source and then @import _navigation.less within there.

[@takeabreak9927]

Can you please share your code? I am also using magento 2.4

[@pmarketph1378]

This is very helpful, what text editor are you using?

[@MaxPronko]

PMarket PH thank you for the feedback. I use PHPStorm - very powerful editor.

[@tristanraissherman]

This absolutely slaps. Thank you!

[@kimgeneralao]

Thank You sir..It's a big help for me as a beginner for all aspect in magento and developing .

[@fabian0pr]

Hi Max, very good your tutorial! I would like to modify the structure of the head, for example: Logo - Cart - Search What files should I overwrite to make these structure changes? Regards

[@seckinkukrer6920]

Sir, this is my first video about building custom theme, it was so clear to me. Thank you.

[@MaxPronko]

Thank you for watching and the feedback.

[@vadimluhovoi9586]

Привет Max. Подскажи пож-та, если добавляются новые блоки (с новым классом) в кастомной теме, то где должны лежать эти блоки и темплейты? (в теме или в их в кастомном модуле) P.S. Спасибо за видео!

[@MaxPronko]

В модуле, и блоки и шаблоны, но less можно добавить в тему

[@bhaskarpothineni8768]

Nice Video...Thank You. If i switch the theme the cms blocks are there in two themes . I just want in one theme only . Can you plz tell me the solution.

[@nandaghimire4951]

i can't get data after changing theme please help !

[@urkizdurkiz4313]

could you please, make a sticky header containing a image block and categories below it?

[@sandeepdcte]

Superb video! Need your guidance regarding Magento 2 Database structure, Administration, Theme, Module/Extension/Component and development/customization....Please suggest how I can proceed ? Thanks in advance

[@Kooking4fun]

Hi I followed the procedure but my custom theme not showing in the Applied theme list please help.

[@MaxPronko]

Rajeshwar Mahato have you tried to flush cache and switch theme in the Magento Admin? Also, check directory names and paths for typos.

[@NdogGodhog42]

Hello Pronko, where I can find the source code of custom-design.svg ?

[@mamatasodate6489]

In this custom theme i don't get css or js file. how to solve it?

[@MaxPronko]

What do you mean you don’t get css or js file? Do you refer to loading issue of a file in a browser?

[@sakthivelr8686]

what editor are you using

[@MaxPronko]

PHPStorm IDE

[@gdesancho]

Hi! Do you know how to make a full new theme from an HTML file? I mean, I designed a website in Bootstrap and I need to use it on Magento. Regards!

[@MaxPronko]

Gustavo de Sancho yes, I know how to do this. You can check my other videos about theme creation in Magento 2 on this channel.

[@andrewlanger6900]

Hridik is a stellar offshore web design and development services company, customized solutions, professionalism, timely delivery, creative ideas, enhanced user experience and affordability are what make us the premier choice of our global clients. To get more information visit here: www.hridik.com/hire-dedicated-magento-developer.html

[@gautamkeshri1602]

Love your video.Thanks for this tutorial. It would be great if you can show how to customize specific product page for example gallery on side of the product rather then below and only in one column.

[@daminiyadav5131]

how to add imagen in the theme on magento2

[@GodsGaming14]

can u mail me the code in custom-design.svc as i cant see the whole line

[@deckside74]

What mode do you have Magento running when you are editing? Production, Developer, Default? Great video

[@MaxPronko]

DECKSIDE.COM.AU thanks for the feedback. I usually run under developer mode.

[@tantivit]

Thanks Max for the video! Btw, should we change the version part in composer.json file? Now we are using magento 2.3.6 version. Many thanks again!

[@MaxPronko]

Yes

[@enggarshad83]

Excellent Tutorial for customizing magento2 theme. Thanks Max

[@MaxPronko]

Thank you for watching.

[@lukass3310]

Hex Max, I would like to see implementing bootstrap theme into magento either from scratch or to modify completely existing one. You could do some series about it :)

[@willdavies6929]

Lukas Stranovsky i would love this also

[@freeaed]

it is great tutorial but the color in the last step didnt change from orange

[@puneetgangwani1030]

You are great man...….Very good videos on magento 2 please make more videos on magento 2 theme customization

[@izharahmed1091]

I want to learn Magento 2 front-end development what should I do.

[@MaxPronko]

Learn and practice.

[@izharahmed1091]

@@MaxPronko suggest any good source for learning

[@MaxPronko]

Here you are magemastery.net

[@cardbored_]

This didn't work for me, well it sort of worked. When I activated my custom theme following your steps exactly all of the styles disappeared on the site even though Luma was set to be the parent.

[@MaxPronko]

Check for any TYPOs in your code.

[@mrudu_15]

Can you post video about how to angularjs theme template integrate with Magento2?

[@MaxPronko]

Do you want to build an independent Angular based storefront theme? You would better check out Vue Storefront.

[@mrudu_15]

@@MaxPronko can you post that Vue Storefront link which is related to Magento angular js theme ?

[@enggarshad83]

My question will be silly. when to delete folders from static(requirejs,frontend) and var(cache,generation code)

[@MaxPronko]

During development on your local environment you should delete static files if it wasn't updated automatically as they are all symlinks to your files in a project, for cache - when you change layout, phtml or xml files, for generated/ when you add new module or create a proxy, plugin classes.

[@daniloparra5609]

Thanks man, would love to see more videos on magento theme development :D

[@shahirhajir1689]

Very Nice, keep these videos coming ! Would be nice if you make a whole series, where you explain about how to add custom functionalities to a Storefron site, with Javascript and RequireJS.

[@MaxPronko]

Hi shahir X, thank you for the feedback. I think this is a great idea to create series of tutorials. I added it into my plan for next videos. Thanks.

[@himabindhu3189]

Hii max can u please send code it will help us

[@mrudu_15]

can you tell me how can we integrate magento2 with salesforce ?

[@kapildikshit1710]

Sir please tell me the how custom module work in detail please please sir my humble request

[@vissacomercial8727]

quanto cobraria apenas para instalar um thema magento 2 pra mim, instalar/configurar?

[@jitendraprajapat6892]

Thank you such an amazing tutorial easy to understand.

[@jitendraprajapat6892]

Sir please can you provide me a videos about module development

[@jitendraprajapat6892]

Actually i have joining in a company as magneto developer before joining i want to clear all doubts

[@MaxPronko]

Checkout this portal magemastery.net

[@jitendraprajapat6892]

@@MaxPronko Sure sir

[@technicalshohel]

hello sir I am fresher and few days I started Magento learning, please help me I started first Magento 1 or direct start Magento 2

[@MaxPronko]

Shohel Hussain do you have any specific questions regarding Magento 2 or general advices?

[@vivekvanga737]

Thank you sir.. awesome video.. could you please make a video on How to add Bootstrap css and Bootstrap Js in our custom theme..

[@croposman]

Great video! I want to see more :)

[@DStudios]

Hi Mr. Pronko i liked your video very much. It is very helpful. But can't able to find your next videos on this can you please help me out.

[@MaxPronko]

Here is the playlist with the custom theme tutorials for Magento 2.3 - kzbin.info/aero/PLwcl8DqLMv9f6Ygxgg-_Vk-UdY9FDhpQ_

[@DStudios]

thnak you for the reply, but the link is not working

[@Act1veSp1n]

Thanks for the tutorial! I dont understand, how does one even do any programming like this? Deleting folders / running cache refreshes every time - Magento 2 seems like huge pain in the ass.

[@MaxPronko]

There are lots of tools available for Magento 2 that weren’t covered in this video. Check out my other videos to get a better idea how to work with Magento 2.

[@mayaisland1840]

Very informative. I really appreciate your time and tutorial. Very clear and at a pace that worked for me. All went great and I only had one issue and that was at the end when you showed us how to change the border color of the navigation menu. I have no experience with less but I followed your steps and I can't get the color to change. I tried a different browser and I even disabled the browser cache and no luck. I also flushed Magento cache - Any thoughts?

[@MaxPronko]

Hi Maya, did you sort the issue with the border color? Let me know.

[@Gorr1995]

автор , а откуда ты узнал , что цвет бордера нужно искать в файле навигация лес ?

[@MaxPronko]

Gorr1995 спасибо за Ваш комментарий. Структура Мадженто 2 платформы позволяет легко найти необходимые файлы темы включая less, javascript, html, а также дополнительные сторонние библиотеки. Для этого необходимо ознакомиться с документацией которую можно найти на сайте devdocs.magento.com. Спасибо

[@swapnilpatil909]

Please make your voice loud so it can be heard clearly. This is great tutorial for people like me. please make more videos on this topic

[@divineshortsworld]

Nice explanation....I am new in magento and I am looking exact tutorial like this...awesome... :)

[@danieleszterle758]

Good video!! Can you make a video about how to create custom blocks for your custom theme?

[@jennymag1182]

Great tutorial. You made it very easy to follow. Thank you!

[@MaxPronko]

Jenn Magro Lucano thank you, Jenn for the feedback. Really appreciate it. I am glad you like the videos

[@crismablanco]

Hi !! thanks for the Video. What IDE are you using ?

[@MaxPronko]

Cristian Blanco I use PHPStorm editor, very powerful IDE. Recommend it, it also has Magento 2 plugin for development

[@crismablanco]

is there any free licence for PHPStorm or is it always for paid?

[@MaxPronko]

Cristian Blanco it has 30 days free and then 99$ per year, worth spending for a great tool

[@trainwithbhupendra]

What was the editor, sublime?

[@agnieszkaszmit7969]

Hi, I think Max uses PhpStorm

[@PiotrFicner]

How about Bootstrap Studio? Have you tried to create a Theme for Magento with it? If no, would you give it a try? Thank you for all your work! :)

[@MaxPronko]

Never tried Bootstrap studio. Do you recommend?

[@PiotrFicner]

I have it here and like it. Use it just for simple projects. Don't know if would be possible to create a Theme for Magento and make it working. Quite a challenge can say. I could share my license with you if you want to give it a try.

[@tinmtc]

Something went wrong while saving this configuration: Area is already set --- wth is going on???

[@MaxPronko]

Tin MT hi, I am also interested what is going on? Do you have details of your customizations done for the particular Magento 2 installation?

[@tinmtc]

Yes, i do. I only set theme for website, but i can't set theme for store view like you. thanks

[@MaxPronko]

Tin MT can you please share more info about how you actually set the theme?

[@tinmtc]

Max Pronko i got it, thanks for sharing video

[@yorki7203]

This is issue #14968 of v2.2.4

[@codinginthecold2376]

Thanks Max, you're the best.

[@suiteCRMtutorials]

Супер! Все чётко и без лишний воды

[@zuberdadani3633]

thank you could u plz make video about magamenu

[@nagrgk]

why did you copy complete _navigation.less? you could have extended than overriding less file. Structured way _buttons_extend.less and _navigation_extend.less, then add your changes for each component in the corresponding file. Then you create the _extend.less file adding this code: @import '_buttons_extend.less'; @import '_navigation_extend.less';

[@MaxPronko]

Hi Nagaraj, thank you for your suggestion. It makes sense for me. I will do the next video on the subject with your tip included. Thanks.

[@jelenko984]

Great video Max, thanks!

[@MaxPronko]

Thank you.

[@Von-Land]

Hi Max Pronko, I had work like you but not file default.xml dont working. The Logo no change. Please help me.prntscr.com/jywpkg. I had use 2 theme magento in database beause it make error

[@FabrizioBalliano]

Great video man! Can I ask you what MAMP stack you use? It seems pretty fast!

[@MaxPronko]

Thanks for the feedback! My machine is: MacBook Pro 2.7, 16GB, 8 CPUs. Apache 2.4 and PHP 7.0.18 (with xDebug enabled) installed via Brew. I still prefer to run Magento 2 on ubuntu rather than OS :).

[@FabrizioBalliano]

I've a 2015 macbook pro 16gb 8cores but I use MAMP Pro just cause it's easier for vhosts and SSL but it seems much slower (ok your machine is newer but it shouldn't make that much of a difference). Thanks for you answer!

[@MaxPronko]

I think you are asking how a page can be rendered so fast after clearing Magento 2 cache, am I correct? I didn't want viewer to wait seconds before page will be shown, some parts were cut during video preparation to make it faster, otherwise video could be 18 minutes.

[@FabrizioBalliano]

hahah ok ok now I can stop scratching my head trying to understand :D

[@zaranapatel8018]

Thanks for this video sir. Everything is working fine for me. but I changed in less file according to this video but it's not working.

[@agnieszkaszmit7969]

Hi the same for me. M2.3.3. I couldn't change the nav borderline.

[@zmark2274]

спасибо, Макс!

[@awwwwan]

Very nice tutorial please guide us how to create custom module layout and also upload some tutorials on magento 2 layout xml and how to extend layout.

[@allanminium]

Spasibo Max!

[@kosirmilan]

Amazing tutorial, thank you so much!

[@MaxPronko]

Milan Kosir thank you for watching!

[@FernandoSouza-yj3xl]

Really good, i want to see more videos like, great work

[@MaxPronko]

Luiz Fernando de Souza Filho Thank you for the feedback. I work on more videos for this channel so make sure to follow it.

[@ArbitraryZer0101]

no subtitles, not understand what you say

[@MaxPronko]

Sorry to hear that

[@enriquedb666]

Great video thank you

[@jdw7577]

Привет После того, как сделал кастом тему (по твоему примеру) и поменял, слетели много страниц (все кроме страниц с каталогами). Что это может быть и как это поправить ? take.ms/x3FPn

[@Eskimoz]

Très bien réalisé merci pour ce contenu !

[@Ajithkumarm107]

Great Man... Vera Level Tutorial...

[@ismailkhanv8256]

Thank for the video

[@MaxPronko]

Thank you for watching.

[@Hambini]

really good video. very helpful

[@MaxPronko]

Thank you for the feedback, Hambini. Let me know if you are looking for some specific guidance

[@shhehzadahmed]

Hi :) I have subscribed to your channel and will recommend to my friends. But i need a little more help about theme help in magento 2. Can you upload a tutorial where you can show how to apply PSD website design to magento 2 website/e-commerce store. Thanks in advance :)

[@foysalfoysal4304]

I need Magento 1 to Magento 2 Migration Video.

[@MaxPronko]

What would you like to see in the video?

[@foysalfoysal4304]

Migration of a Magento 1 store to a Magento 2 store.

[@hardeepsingh007]

thanks a ton.. very informative