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.
Related
So we got a great project and we absolutely have to learn Typo3 or Drupal for it quickly. I already know some basic things.
I did the installation correctly for both, I know how to set up a basic Site using Fluid Template in Typo3 and I know how to set up a basic template in drupal without any styles.
My Problem now is how do I style a website since typo3 or drupal doesn't have a field for classes (The fields just get some random ids) and also how can I build a website with multiple sections where I have to style each section individually.
If you have any links to good tutorials or anything else that explains what I need to know I would appreciate it.
First of all, i think you understand HTML/CSS and know that TYPO3,... are content management systems. They're wrapping your content (saved to the database) with a template like HTML Files to send the result to the browser as a full rendered website.
ThomasLöffler already gave you the hint to read the documentation on both websites to make your choice which one you want to use. I prefer TYPO3, but the start many years ago wasn't easy. So i could you explain a little bit, and on a very short way what you need to do... After all please read the docs on typo3.org (Gettin started guide or something)
In TYPO3 you need to include and build your HTML Template. Prefered with the FLUID Template Engine / Framework. After that you need to set it with the TYPO3 TypoScript as your main template.
The content templates like will be rendered by the TYPO3 Extension "fluid_styled_content". This extension has also fluid templates to render the content object into a html output. Before you have enough knowledge about typo3 it's not recomended to change them.
The main thing is, that you need to include a stylesheet (css) file in your site. In TYPO3's TypoScript it's for example like this:
page.includeCSS.file100 = path/to/your/css/mystyle.css
Thats the very short overview and very little explanation what to do. But as Thomas said, you need to understand both and decide for one of them. And of course you need to read the docs first a little bit, before you ask. That would help you and each of us, to give you better answers. Good luck!
TYPO3 Gett started:
https://docs.typo3.org/typo3cms/GettingStartedTutorial/Introduction/Index.html
You can learn a lot of things if you take a look into the code of the official introduction package (https://extensions.typo3.org/extension/introduction/) The package can simply installed over the extension manager -> get preconfigured distributions
Or you just use it as a basis to build your own layout. You do not have to reinvent the wheel ;)
This question is addressed only to people having some experience in programming MediaWiki plugins.
I want to put some header at top of page with use plugin and html. I need to put some html code as the first tag after <body> opens to not but not know which hook or method should I use to achieve goal - Mediawiki has too much hooks to choose please suggest one.
http://www.mediawiki.org/wiki/Manual:Hooks
Result after plugin run should look like this:
<< Custom header>>
-----
<< Unchanged Mediawiki page >>
Could you help with this trivial problem?
One possible solution is to inject some JavaScript to create HTML but it is artificial and it will not work with Google Search Bot.
I think that many people want to put something on the top of their MediaWiki-s but without writing and maintain yet another skin or branching Mediawiki and it is supported today.
But if you think hooks is what you want, I'd go with ParserBeforeTidy. The hooks list is long but divided into sections, and "Page Rendering" is section you want to check. Parser(Before/After)Tidy are called on fully generated page, so they offer the highest degree of customization (which may be undesired, though).
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.
I am starting to build a website in Joomla 1.6. The website is going to primarily have two layouts. One for the homepage and the other is for all the other sub-pages.
The catch: I am wanting to put both the layouts in one template (or folder).
I have seen this done before by using a conditional statement with the JURI:current() function, but for some odd reason, it is not working properly for me.
Here is some basic psuedocode to indicate what I am trying to do...
<?php
$HomePagePath = 'Homepage URL here...';
echo JURI::current(); // Just to test what the current output is going to be.
?>
<?php if(JURI::current() == $HomePagePath ): ?>
Template for homepage here
<? else; ?>
Template for sub-pages here
<? endif; ?>
When I test what I am building with this code, it is not working properly. I have ensured several times that the output from the current JURI matches the current URL in the browser. It is showing me the sub-page content rather than the homepage content... I am not sure what is causing this :/ ...
I am currently running this website without a real domain behind it. I am using the GoDaddy Preview DNS feature for the time being... This feature basically gives me a temporary domain until I point the appropriate one. I do not know if this could have something to do with the current JURI not parsing properly? This is the only thing I can think of that would be causing this...
I guess my next question is... do you know another method, other than the current() function, that will accomplish what I am trying to do?
Thanks!
Chris
You can use template Styles to help in this process.
You can duplicate styles, and change things about the style - but each style will use the same 'template'.
I've played around with it a bit and I think it's probably pretty close to exactly what you're looking to do - unless you wanted a completely separate look for the 2nd template in which case using 2 templates will probably be the 'best bet'.
I'd recommend looking into template styles though - essentially you could have as many 'styles' of the template as you want, but everything is based off of that one 'template', it's only the style that's changing. You can go into your menu items and select that style from the dropdown for templates. I hope that helps to make sense, because it sounds like exactly what you're looking for.
Also, I'd recommend following the upgrade to 1.7 before you get too far along in development. Both for security reasons, and to make sure your template items work smoothly with 1.7 (they're pretty similar, but I've had some templates that didn't enjoy the jump from 1.6 -> 1.7).
*edit: here is a little information on it: Joomla Styles
I have a web application developed using PHP. I want my users to select themes for their pages throughout the application.
Where should I start before using PHP themes?
What should I know about Themes in a PHP application?
Edit:
My question about themes is only about changing the color of the layout, not the images.
Suppose My ADMIN user will have white and Orange, but my staff user will have white and green...
How it can be done in PHP with CodeIgniter?
There are lots of directions you can go with this.
1) "CSS ZEN"
This is where the markup remains unchanged, but you totally change the design just by using CSS and images. Demonstrated very well on http://www.csszengarden.com/
2) MVC Stylee
This is where you create a model that represents the page data and then pass it to a view, which contains some inline echo statements. The idea is that you could send the same model to a totally different view so it could look entirely different, HTML and all. Cake PHP is a good start for this: http://cakephp.org/
Example:
<div class="content">
<? echo $Page->Content ?>
</div>
3) Micro-Markup
With this method, you add your own "special tags" to an HTML page. You then read in your plain HTML page and replace the special tags with the information you want to display. This is good if you want your templates to be recognisable to HTML guys that don't know PHP and might break the PHP code in the MVC app.
Example:
<div class="content">
<#Content#>
</div>
Out of all of these, MVC is a very structured way of achieving what you want - however, I listed the other options as they cater for specific scenarios that might be relevant to you.
I have implemented the concept in all three of these, in situations that were appropriate for each.
Regarding The Edit In The Question
I imagine you'll have "something" that represents your user - so it is as easy as:
(In the event of just wanting to override a few settings...)
<link href="style.css" type="text/css" rel="stylesheet">
<?php if ($User->Type === USER_ADMIN) { ?>
<link href="admin.css" type="text/css" rel="stylesheet">
<?php } ?>
You can adjust this example in the following ways:
Use a switch statement if there will be many user types
If the replacement is total, rather than just a few overrides, you may want to completely swap the stylesheet.
You would usually set up template files that contain the HTML and CSS, and build in the PHP generated values at runtime.
The best approach to this is to have the theme reside in a separate directory, containing no code, just template variables like {mainmenu}, {backbutton}, {content} ... you get my drift. Those are then filled by your PHP script, possibly with the help of a template engine like Smarty (No need to re-invent the wheel here).
There is also the approach of having PHP markup directly in the template file(s) like echo $xyz; while this is a perfectly valid practice I use myself often, I recommend using a template engine over using PHP markup in the code if you want a solid, future-proof templating system because:
First, there is less that a designer can break when working on the HTML.
Second, having PHP markup in the code is a temptation to program PHP logic inside the template (loops, conditions) instead of properly preparing them in the PHP code at the point where the template variables are created. That is terrible for maintenance and the further use of your templates, because you have to replicate that PHP soup into every new template again. After all, you want to have a template engine so others can create new looks for your product, without having to know how to program it.
Third, with the templating engine based approach you have the possibility to add caching where necessary without any additional work. Not possible with the scripting approach. Yes, in a web application you won't be able to cache that much, but with a lot of data, there will be instances where it will help the user experience.
Fourth and least important, it makes your template less easy to export to other applications, and import templates from other applications.
The CSS Zen approach mentioned by Sohnee is great for websites, but is going to be too limited for a web application that uses complex input elements, JS based menus, and the like. It is too often that those elements need to be changed and customized in the markup.
If you have a look at my CodeIgniter Template library it briefly explains how you can set up themes and layouts (the equivalent of header & footer).
If you set up global code such as a Hook or a MY_Controller then you can dynamically set your theme based on the logged in user, the user type, etc.
Eg:
if($user->role == 'admin')
{
$this->template->set_theme('admin_skin');
}
else
{
$this->template->set_theme($user->theme);
}
That is just a VERY basic example of the sort of thing you could use this Template library for.
CMS Solutions
Magento and Wordpress package all theme related files into their own seperate directories. These contain the serverside code, stylesheets, images and javaScript for the theme. The user in effect chooses a directory to use which affects how the page is layed out and styled.
An easier approach
A much easier way to get started would be to accept that the actual content, e.g. HTML of a page would stay the same, but let the user choose from various CSS style sheets.
When choosing a style sheet the system could use JavaScript to load it in dynamically so that the user can preview the look they are choosing.
If you have really good semantic HTML it will be enough to change the CSS files. Unless the design changes are really heavy. Then it would make sense to provide PHP templates that are build with some sort of modules: variables which contain certain HTML structure like navigation or sidebar, etc.
For themes you do not need PHP. Just define your themes in CSS (the best way is one file for each theme) and use a simple JavaScript chooser like at this site: http://www.fotokluburan.cz/switchcss.js.