TL: DR
Você cria usando o luma nativo ou o tema em branco? Ou qualquer outra coisa?
Depende de você, declarar um tema pai é opcional. Se você não declarar um pai, continuará usando os módulos (por exemplo, Magento_Catalog) que fornecem arquivos XML e de modelo, mas sem estilo.
Você usa alguma extensão para ajudá-lo a desenvolver seu tema?
Como prefiro trabalhar com SCSS e GULP, agora uso o Frontools e o tema em branco do SCSS . Isso elimina muito o estresse de lidar com o fluxo de trabalho padrão Grunt / LESS.
Quais etapas você segue ao desenvolver um tema a partir do zero?
- Declare o tema
- Remover CSS do tema pai (se necessário)
- Adicione seu próprio CSS / LESS / SCSS
Minha opinião pessoal é que é melhor criar seu próprio 'tema em branco' do zero, pois você pode adaptá-lo para que seja exatamente o que você precisa.
É assim que eu criaria um tema a partir do zero, usei NewStore / default como meu fornecedor e nome do tema.
Agora, a resposta mais detalhada ...
Crie o tema (conforme documentos oficiais)
Crie o tema conforme os documentos oficiais
Opcionalmente declarando um pai
Dentro de app/design/frontend/NewStore/default/theme.xmlvocê, você tem a opção de declarar ou não um tema principal, neste exemplo deixei de fora a linha 3 ( <parent>Vendor/theme</parent>), para que não haja um tema principal . Isso significa que todos os modelos / arquivos de layout serão provenientes dos próprios módulos e não do Blank ou Luma, e não haverá estilo de tema, pois isso será adicionado ao tema em branco.
Meu theme.xml fica assim:
<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
<title>NewStore default</title>
<media>
<preview_image>media/preview.jpg</preview_image>
</media>
</theme>
Remova o estilo (se você definir um tema pai) e adicione seu próprio CSS
Se você definir em branco ou Luma como pai, será necessário impedir o carregamento dos arquivos CSS. Para fazer isso, crie app/design/frontend/NewStore/default/Magento_Theme/layout/default_head_blocks.xmle adicione o seguinte 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>
<!-- Remove blank/luma theme styling if you declared a parent -->
<remove src="css/styles-m.css" />
<remove src="css/styles-l.css" />
<remove src="css/print.css" />
<!-- Add your own CSS files -->
<css src="css/styles.css" />
</head>
</page>
Isso remove styles-m.css, styles-l.csse print.cssadicionado pelo tema em branco. Ele também adiciona o styles.css como base para o seu próprio CSS.
Se você não especificou um pai, pode remover as três <remove />tags no código acima.
Adicione seu próprio CSS
Agora você pode estilizar seu tema da maneira que desejar, sou um fã de Sass e não de MENOS, então adicionei este arquivo - app/design/frontend/NewStore/default/web/css/styles.scss
Alterei a cor do plano de fundo aqui apenas para provar que isso funciona. Idealmente, você usaria esse arquivo apenas para importar outros arquivos Sass / Less.
Resultado
O resultado do que acabei de fazer é um tema sem estilo (além do meu lindo fundo verde), permitindo que você estilize seu tema sem trabalhar com o estilo do Magento (às vezes difícil de trabalhar).
Dicas
Se você prefere trabalhar com o SCSS e não tem tempo para criar um tema a partir do zero, recomendo usar o Frontools e o tema em branco do SCSS, ambos pela Snowdog Apps .
Acho que o aspecto mais frustrante de trabalhar com o código de front-end do Magento é a especificidade de seu estilo, para evitar isso, recomendo usar a convenção de nomenclatura BEM ao escrever seu próprio estilo.
Também são úteis comentários úteis, se um desenvolvedor acostumado a trabalhar com o Luma / Blank trabalhava em um tema construído do zero, provavelmente descobriria que as coisas funcionam de maneira bem diferente do que eles esperam.