I am a beginner with Magento trying to build a simple custom theme and while I have done a fair bit of research I am really in need of some simple clarifications because I think that the learning curve is rather steep but worth it once some basic concepts are understood. My design goals are very basic: All products listed on the homepage with different image sizes, floating left.
What I've done is downloaded the 'Modern' theme as a base to work with and renamed it:
app/design/frontend/default/mytheme
skin/frontend/default/mytheme
I've done some basic tweaking to the phtml files in
app/design/frontend/default/mytheme/template/
However, I have a number of questions:
Where exactly is the template for the homepage? Is it only customizable using the CMS>Pages control in the backend under Design>Page Layout? This confuses me because I am used to developing in wordpress and creating a custom php file for the index/homepage. I really think this separation of html/xml is really the hard thing for me to grasp.
If i can only customize the homepage using the backend, I see the block: <block type="catalog/product_new" name="home.catalog.product.new" alias="product_new" template="catalog/product/new.phtml" after="cms_page">. Navigating to mytheme directory, I don't see anything referring to this. Where are these things located? Am I supposed to copy any file missing from mytheme from the base?
Is it only possible to have 1 column, 2 column, 3 column etc. layouts?
An endless thanks to anyone who can steer me in the right direction. I really think it is just a matter of understanding very important fundamentals of how Magento themes are structured. At the moment I am already finding it so frustrating having my finder window open 7 folders deep and having to move around constantly. How I miss the simplicity of Wordpress' single folder themes.
Thank you!!
I suggest you to read all things in http://www.magentocommerce.com/knowledge-base before you go further
homepage content can be anything you want and you can reference it to be anything with layout file descriptors
MVC concept tells that it is taken from catalog/product_new block and from whatever is set to it's template. In current case catalog/product/new.phtml is used and you can edit this
you can have a completely custom setup and not restricted to anything that default contains. However it is wise to use defaults as almost all extensions depend on defaults more or less.
A very big part of magento design is layouts.
whether you choose to use a local.xml or change files from layouts folder you must have an ideea on how they work.
Here is a link for start
Intro to Layouts
There are many others resources outhere ofcourse.
Related
I am making a site with Joomla mainly because of the user levels. Now hands on into development enough that I cannot back out, I've realized that Joomla's theming is not as awesome as WordPress'.
When I started making the Joomla theme I realized there is no single.php like separate template for displaying article pages. But I want that when I click on an article link the page layout is wider so that the full article is more readable, basically I wanna hide the sidebar and make the article column wider when viewing a single article.
The biggest problem is that I have finished the HTML & CSS pre Joomla or any CMS jump with all the HTML5 tags and what not. I figured there would be template tags like WordPress or something similar that would give me complete control of my HTML but with Joomla everything just gets rendered as complete components with HTML and CSS all set in. It was such a pain when the pagination just rendered as a list when all I wanted was 2 links of previous page and next page. Am I doing something wrong or is Joomla just built this way.
If I start changing the components and modules the way I want, will they be changed back to defaults when I update the core. I read somewhere from 1.7 Joomla has integrated 1 click upgrades.
I sincerely hope I'm just wrong.
Sorry for jamming three questions in one but I think my title is quite explanatory so anyone looking for similar things would understand.
Thanks! I appreciate all the help.
and welcome to Joomla. Because your question(s) are long so will your answer so hold still...
First of all just to clear it up, the Joomla templating is a proper templating engine where as Wordpress is not (it's not even a CMS - check their website), this is often construed as poor coding rather than best practice as it's more of a steep learning curve.
1) I wanna hide the sidebar and make the article column wider when viewing a single article.
This can be done through conditional assignment within your template, if around your RH column in your template you can place this if statement:
if (JRequest::getString('option') != 'com_content' && JRequest::getString('view') != 'article') { echo '<div id="myRightHandColumn"><jdoc:include type="modules" name="right" style="xhtml" /></div>'; }
You will also need to apply this code to add a class to your wrapper around your main content to tell your CSS to make it wide.
2) give me complete control of my HTML but with Joomla everything just gets rendered as complete components with HTML and CSS all set in
That's not entirely true, all WELL made extensions have a views folder containing overridable html output. For example if you wished different HTML to be outputted for the article view from com_content you would copy this file:
/components/com_content/views/article/tmpl/default.php
and place it in your template like so:
/templates/your_template_name/html/com_content/article/default.php
3) If I start changing the components and modules the way I want, will they be changed back to defaults when I update the core.
Assuming you follow my instructions and use overrides rather than core-hacks then you will not lose changes when upgrading the core. Naturally you should never upgrade in a production environment.
If any parts are unclear just drop a comment and I will help as best I can.
You are definitely doing it wrong, Joomla's templating system is far more advanced and flexible than WP. You need to read up on the template override system and how to use collapsible module positions. The official documentation is still 1.5 focused, but it's pretty much the same thing as far as overrides and modules are concerned.
Overrides - http://docs.joomla.org/Understanding_Output_Overrides
Collapsing columns - http://docs.joomla.org/Collapsing_columns
All template docs - http://docs.joomla.org/Template_Development
You should also look in to the new template style options.
I'm pretty new to wordpress (only a couple of days), but I have it up and running on my website with the default theme. First of all I would like to change this theme. I have found a tutorial directly from wordpress but it is extremely vague: http://codex.wordpress.org/Theme_Development. I'd like to have a totally different layout for my website though, with only one page being replaced daily with a different article - a new article everyday basically. But I don't know where to start. I want to first create the theme though, I think that will put things in to perspective. How do I do so? I know the principles of php and enough about html and css to create whole websites. Thank you
That link should tell you everything you need to know. You basically just edit the theme files to get the layout that you want. The best way to learn truly is to experiment. If you have a specific question I could help you with that, but to tell everything involved in creating a custom theme would go way beyond the scope of an answer for this site.
after using own custom cms for over 6 years, I decided to go for Drupal from now on. I will use Drupal for all my works. I'm pretty new at Drupal, started just 2 days ago :D
just a simple question;
I have a simple xhtml-css site (5 pages), and client is asking cms for gallery page (xhtml for now). so is it possible to make only 1 page with drupal and rest pages are using current xhtml somehow? How would I create the base with Drupal for such custom (out of Drupal) pages' links? or do I have to transfer all other html pages into Drupal as Page (drupal page)?
ps, as a new drupal user, i didnt see anything complicated as everybody complains, it is pretty well structured-clear... love it so far :) ps, i say 2 days but I had only few hours so far :)
Thanks a lot!!
The Drupal URL rewriting rules only apply to files and directories that do not exist on the file system, so as long as you avoid naming conflicts, you can put 'static' pages more or less anywhere you like, and Drupal will not interfere with them being served.
That said, it would probably be a good idea to consolidate them within a 'static' folder, either on the top level of the document root, or (more appropriate) within the 'sites' or the 'files' folder of the new Drupal install (which implies adjusting your current paths).
However, I agree with Kevin (+1) that for only 5 pages, it is probably less work in the long run to 'migrate' them to Drupal right from the start, as you will save work and trouble down the road as soon as you further enhance the site.
If its only 5 pages, why not put it all into Drupal? Less overhead that way. Otherwise you will have to edit .htaccess, manually update files instead of making simple changes in Drupal, and edit multiple files should the theme change in any way.
If you need a Gallery solution, I would suggest checking out the Gallery Assist module.
If all 5 pages use the same or similar layouts, navigation, etc then it makes the most sense to put them all in Drupal.
Setting up, configuring, and theming Drupal will be a lot more effort than one page is worth.
But if all your content does not share a similar layout and have very different looks then you may consider leaving them static.
There are many ways to vary the the layout, navigaiton, and such within Drupal, but this may be a challenge for a Drupal beginner and even require a substantial effort from Drupal pros.
If you leave content external to Drupal that includes identical layout elements, it leads to redundant work.
I'm interested in creating a custom theme for a Drupal site I'm working on. I am new to Drupal, however I have a decent bit of experience in working with the underlying concepts that it seems are needed to build a theme (CSS, PHP, HTML).
So, my question is - where do I start? Is there a canonical guide to creating Drupal themes? Resources that I should be aware of (other than the Theming Guide)? Gotchas that others have encountered, or just general words of wisdom from those who are more experienced?
Can I recommend you install the DEVEL module
http://drupal.org/project/devel
It can give you some really insightful clues how your page is being put together.
It also comes with a really useful feature called DRUAPL THEMER INFORMATION, which when activated lets you click on parts of your page, and tells you what bits of code did what.
My second tip is try and create your own node type templates, and then find out how the node data works.
For example in the theme folder create a new file called node-story.tpl.php
<?php
print "<textarea cols=100 rows=30>". print_r($node,true) ."</textarea>";
# or krumo($node); # if you have krumo installed
print "<h1>". $node->title ."</h1>";
print "<p>" . formdat_date($node->created,"custom", "d/m/Y) ."</p>" ;
?>
Start with a starter theme and then build you own on top it. Here's a comparison table of different starter themes.
Update: There's also a starter theme review with screenshots, where the author explains them:
Starter or "base" themes are a class
of themes that seek to provide
best-practices starting points for
themers to build unique designs. Most
include a common set of features
necessary for most sites, helping to
minimize the repetition of a themer
recreating many similar files, markup
and code for each project.
The best way to do it is to start with a theme, and modify it bit by bit. That's how most of the people whom I know do it. You take the themes/garland directory and copy it to sites/all/themes/garland-modified, then you change a few things in it to reflect the new change (in principle you rename the .info file to the new directory location and you edit it to change garland to your new directory), then you go bit by bit and change things in the files to reflect your design.
This may seem tedious and a waste of time (why not just start from scratch?) but you have several advantages:
you start with a working theme
you start with a complete theme, wich everything you may want
you don't risk of forgetting pieces which are required to have a working site
There are starter kits which are supposed to make things easier (see the zen theme for example) which you basically edit in a similar way I outlined above. But I found them a bit harder to understand...
Good luck with Drupal theming :)
There is a learning curve, but I would recommend you start with the Zen Theme which has a theme starter kit included. Purchase the Drupal 6 Themes Book, Using Drupal Book and Front End Drupal and it should get you going in the right direction.
I've been learning it for almost 5 months now (coming from the Joomla world) and I have found it helpful to get to know the Drupal system by actually working with the examples from Using Drupal and the Front End Drupal Book. It really got me up to speed on how the system works, from installing modules, to configuring modules and setting up permissions and all the how to's for creating themes.
Learning how to setup a Drupal site is pertinent to building and deploying sites with Drupal as well as theming sites because the contributed modules as well as the core ones have to be over written with your own styles. Most people come into Drupal thinking that Drupal Themers are Designers but they are not. Most of them are programmers with little or no design experience and have someone else hand a pre-made design to them and then they take it integrate with Drupal. You will have to have, xhtml, css and some php experience to theme for Drupal. I hope this helps.
Here's a really top notch tutorial
http://acquia.com/community/resources/acquia-tv/tips-and-tricks-drupal-theming-90-minute-tutorial
zen as a starter theme and use the module that lets you mouseover your page and suggests page template names for those elements you want to theme. forgot the name of the module but it really kick started things for me. its not that straightforward otherwise. good luck
I'm new to Drupal, and frankly after reading through the Drupal documentation, their guide to themeing isn't all that helpful. Maybe I'm just misunderstanding, but it seems like there are certain variables you always have access to and different functions you can define to override or implement behavior.
Long story short, I'd like to be able to trace through the Drual themeing code to understand hwo it works. Doesn't seem like it should be all that difficult, but I'm having a hard time finding a good reference. Anyone know of one?
http://www.nerdliness.com/article/2007/09/10/drupal-theming
There are a few different resources you can use that might help out:
You can use the irc channel on freenode: #drupal-themes
A module that I hear a lot of themers like is the Devel module - http://drupal.org/project/devel. This is what will allow you to trace through the code and see what variables, function calls, etc. are being used.
You might also want to check out the Druapl 6 Themes book
I'd recommend Front End Drupal: Designing, Theming, Scripting over the Drupal 6 Themes book. I put together a Drupal 6 Theming Cheat Sheet that includes links to the resources I've found most helpful.
Honestly, though there are good links and books to learn from, the way I've learned quickest was to start creating a theme. Create your theme.info file, then begin converting an index.html to page.tpl.php or page-front.tpl.php using the snippets in the cheat sheet or the nerliness.com link mentioned in Robert Harvey's answer. Those two files constitute a bare-bones theme.
From there, you can override additional template files as needed. You can use the Theme developer to find just what templates to override, to customize a particular part of the site. Remember to clear the theme cache, as you add new template files.
Also, make sure your theme has the base template of any file you want to override. See the "Note: There is a bug which prevents derivative template files from being detected..." section of the Core templates and suggestions page, for more details.