designing layout of magento 2 theme - magento

I am new to Magento.
I am creating Magenta 2 site, I have managed to install Magento, and for it to use the luma theme.
I want to be able to edit the theme (through Inheritance), I understand it uses XML files to design the layout, how do I change these, should they be in the new theme folder, and change them there?
If so, where do I get the origonal Luma xml files, or does magento create these? - There are no themes within the app/ folder, is it here where I create the new theme (that inherits from Luma)?
Many thanks for any help, I am completely new to Magento.

You have to create a custom theme and make theme.xml and set a parent to LUMA.
Now app/design/frontend/customthemename
So anything that you want to customized used in customthemename folder
Thanks

You should create a child theme to edit XML file. To create a child theme, there are 3 steps to do:
Firstly, create a new theme directory in app/design/frontend.
Secondly, declare the new theme by:
Creating theme.xml: this file identifies the name, parent and other
basic info of the new theme.
Creating Composer.json: this file is used to install the theme via Composer later.
Creating registration.php: this file is required in any Magento 2 Extension
and Themes.
Creating static files directories: this folder is used to store CSS, JS, image files.
Creating logo folder: this folder contains files that determine the location and size of your new theme logo.
Thirdly, apply and configure theme in admin: - Run Upgrade Command. - Apply the theme. - Deploy.
For more detailed tutorial, go to Guide to create Magento 2 theme.
The original XML files of any module and themes are located in vendor/magento//view/frontend/layout, with the module_name is the module related to the XML file you want to edit.
For example, with homepage CMS, the XML file is located in vendor/magento/module-cms/view/frontend/layout

Related

adding a new theme in magento2

i have uploaded the files of the new theme bought from https://themeforest.net/user/codazon . But don't know where to move each individual files to the correct directories in order to add this new theme. Below is the files inside the new theme folder
Below are the screenshot of what's inside the Theme zip file.
It is hard to guess which theme you have purchase but they must be providing a detailed documentation of that theme through http or wrap inside theme package. For example i have found http://www.codazon.com/document/fastest/magento2/ is the documentation for their M2 Fastest theme from envatomarket page.
Codazon has to kind of zip files one is with complete Magento package and the other has only extension and it’s documentation. Please find out it’s extension zip file only .

Magento 2 Copying Template/View Files from Luma into My own Theme

I have created a new Magento 2 theme and added it's parent as LUMA.
It's all working fine but I want to change the layout of my theme and the templates too.
Under Vendor ... I can see that there's all the folders and templates used in LUMA.
I work like to take a copy of all the LUMA view templates and layouts and copy them for use on my theme.
My question is ...
What do I copy and from where?
And where do I place them templates, views etc ?
Below is the reference for theme integration in magento 2:
http://blog.magestore.com/how-to-create-custom-theme-on-magento-2-part-1/
To copy luma,blank theme or module templates, layout and web files to own custom theme
1) To Copy template file:
vendor/magento/module-catalog/view/frontend/templates/product/list.phtml
Follow this path
app/design/frontend/Vendor/theme/Magento_Catalog/templates/product/list.phtml
2) To Copy layout file:
vendor/magento/module-catalog/view/frontend/layout/catalog_product_view.xml
Follow this path
app/design/frontend/Vendor/theme/Magento_Catalog/layout/catalog_product_view.xml

Prestashop theme not detected

I'm new to Prestashop development. The first thing I've tried is to create a new theme copying the default theme directory in Prestashop 1.6. The problem I have is that, once created, the theme is not detected by Prestashop: is like the directory wasn't there.
If I create a new theme from the admin panel and replace the directory content with the same files, it works ok.
What should I do to make Prestashop detect my theme? I haven't found any information about it.
Thanks a lot.
I already answered on similar question here, there are two ways to solve your issue through backoffice
Copy default theme in Preferences -> Theme press Add new theme
button and then at the bottom Create new theme + choosing Copy missing files from existing theme.
OR if you already copied theme dir/files by FTP
Same steps, but without copy missed files (of course if you have no
missed files) and just put correct new dir name in Name of the theme's directory
This is actually the way it is done - Copying the default theme.
There could be several reasons for that:
Have you changed the name of the copied folder?
Did you use only a single lowercase word as a name?
Did you copy it to the /themes folder?
Here is additonaly info after the copying to do some cleanup: http://doc.prestashop.com/display/PS15/Creating+your+own+theme
Also it is perfectly fine to create a copy of the default theme from the backend. You can find instructions here: http://doc.prestashop.com/display/PS16/Laying+the+Theme's+Foundations#LayingtheTheme'sFoundations-Standingontheshouldersofgiants:copyingthedefaulttheme
For people who are using Prestashop 1.7 or higher and is facing the same problem when copying the Starter Theme, I recommend you to check if you actually have a themes/your_theme/config/theme.yml configuration file because the one that is loaded by default is a theme.dist.yml so Prestashop won't recognize it.

How can I install new theme in Magneto ?

I want to install new theme in magento and I have also followed step of this link (https://www.siteground.com/tutorials/magento/magento_themes.htm) but I am not abling to get theme in magento. Please suggest me how can I install theme in magento ?
Thanks
If you already have the pre-built theme, then in magento project folder navigate to
app/design/frontend/default
Place your theme folder here.
Now to activate your theme. Log in to your admin panel.
Navigate to
system->configuration
Click in the design tab in the left hand side
Under the "Pakage Name" put you package name i.e "default" in this case and under you theme In the "Template" put your theme name "Your_theme_name" i.e your theme folder name that you copied inside default directory.
If you are creating a new theme, just create a new folder inside default directory and follow the step as described above.
In this way you can install a new theme.
Hope this will help.
It depends how theme you want to use is distributed. If it is a package, just extract it to your root folder and you should get proper folders in skin and app/design dirs and what you need to do then is to set correct package and / or theme in backend (Configuration > Web > Design). For full package theme name would probably always be default. Although if you are only adding new theme, you should pick its name app/design/frontend/default/{theme_name} and same in skin folder (if it includes some additional css, images and / or javascript).

breadcrumb.phtml file path?

I am still trying to understand the themeing engine of magento by studying a theme. im my theme there is breadcrumb pthml file in templates/page/html folder which manipulates the bradcrumbs. How does magento know about the file? does the page/html folder is standard.
and what is the role of the
files do in page.xml
The template system in magento consists of
• XML layout configuration
• PHP template files
• PHP block classes
All layout XML files will be found in the app/design/frontend/<interface>/<theme>/layout folder.
All template files will be in the .phtml files found in various folders under the app/design/frontend/<interface>/<theme>/template folder.
All blocks will be in the app/code/<core,local,community>/<namespace>/<module>/Block folder.
You may not find all the layout/template files in same theme say telescope. For example, Magento will check the following folders, in order, for a file named catalog.xml:
app/design/frontend/interface/telescope/layout/
app/design/frontend/interface/default/layout/
app/design/frontend/base/default/layout/
Breadcrumbs template file will be under your current theme.
for example:
app/design/frontend/<pkg>/<theme>/template/page/html/breadcrumbs.phtml
If its not present in current theme then it will be in base theme
app/design/frontend/base/default/template/page/html/breadcrumbs.phtml
Magento template engine first looks block/page template in active theme if not found the will look in base theme.
this is handled by layout handlers and block descriptions so if you are new in business head to magento knowledgebase and read theming tutorials there
app/design/frontend/base/default/layout/page.xml:82: <block type="page/html_breadcrumbs" name="breadcrumbs" as="breadcrumbs"/>

Resources