Building a usable Joomla Template to look like Artisteer

11 Posts

steve38 posted this 30 December 2015

Themler Team,
I invested much of my Holiday down time learning Themler. It has not been an easy process but I finally have a result that I might be able to use and have some understanding of the potential and limitations of Themler.
Sure I had to live through you guys doing an upgrade, but progress continued well once I backed out of it and went back to the previous version.
First I still feel your development plan seems to focus on making your tool more usable across platforms then exploiting the strengths of the different platforms. The lack of any module styles, inability to use menu page class or any method of linking Joomla menu ID's to specific Themler templates all feels like lost opportunity. I think you want to believe that developers will want to make a few custom pages with the text, images and formatting all added through Themler and then just use Joomla for the articles. I build large complex sites and fundamental to that is a template that lets me to change style, formatting and control items using the Joomla interface. So not having a left or a right module on one type of page is achieved by not putting a module in that position, not developing a custom page. Same goes for the other module positions. Then we get to the style issue. If I could create custom Module Suffix that I could design and edit in Themler I would see real advantages. But to have to create a specific module position in one class of templates really limits that flexibility.
Anyhow my opinions are just mine. Back to substance and some hard questions.
I built my Artisteer look alike template. In part to see if I could, but because I perhaps have thirty sites that currently use that product so some backwards comparability seemed like a good idea. I am amazed your team has not released an Artisteer clone template design. You should be much better than I have been and many of us could have started to use it immediately just copying it and changing the style as needed. I have added a few module styles in the form of art-nostyle, art-block and art-post. These were not hard to add as extra CSS code but make a real difference to how practicable the template is. I can now use a module position on one page to have a custom html module that will pick up the template formatting (art-block) but also use that module position for a module that its own style or need full size perhaps a promo module like Gavick GK5 News Pro (art-nostyle).
The second generation template I made is attached. It is the result of a lot of stumbling and learning. My development plan is first get a basic Artisteer clone working, then use Themler's new functionality to get a custom homepage that has some more special features like parallax and such. I think I may be almost at that point. My next desire would be to be able to make custom landing pages to provide a more powerful site than just having all the blog pages look the same. Do not think I can do this right now because although I can create separate blog templates in Themler I do not see a way of calling them from Joomla. I solve this on my more custom templates by adding a "body-class" controlled by the menu ID. This lets me select the page design for specific menu items.
So my hot list of enhancements for a Joomla focused Themler would be:
[1] Ability to define a Joomla Position (module) with a set of module suffix and style each of them using your excellent tool. The idea would be to have an extra property on your Joomla module position insert that you could create different module suffix each with unique styles and so have multiple styles defined for all joomla module positions.
[2] Ability to select different "templates" (blog, blog1 etc.) by the Joomla menu ID, probably through a simple interface in the admin interface template back end. Something like mapping Menu ID to template name, if there is nothing there then use the defaults. This would set joomla apart from the other tools but at least play to a strength in your design.
I also made a change to the template I built for myself (Artisteer3) I added an extra module position manually called "content" then added some logic to all the /template files in the template code to switch out the Joomla content (echo '<jdoc:include type="component") whenever there was a module in the position content, then display that content. this lets me add module content in place of the joomla generated content at will. i use this to provide a more custom look to a blog page because joomla does not like to output nothing and this trick lets me preserve valid breadcrumbs. i will share this solution which is really a hack in another post.
there were two things i could not get working in my template.
[3] unable to display breadcrumbs in any position except the top sidebar, the default. if i leave the breadcrumbs in the default place at the top of the content & sidebars it works, move it to any other place in a different sidebar, it displays in the themler editor but not on a real site. as a work around i can output the breadcrumbs to another standard joomla module and they seem to work fine. so i am unclear what that feature does?
[4] there does not seem to be a posts control for dealing with the voting function. if you output the voting it displays really badly by default, so for now voting is not supported in the template.
otherwise the template seems usable. the module positions match that from artisteer with the names, so the menu needs to be in user 3.
overall i found the previous version of the code more stable. my learning curve was longer because sometimes i would try and move a item in the outline list and it would not move, try to drag something in the layout and fail. but then i learnt that often this is a bug and that if you change the order and drag something else you can then get way you want. so now trial and error to move things has become normal, but as a beginner i kept thinking i had done things wrong. the new version seemed much worse and the use of the content & sidebars was just plain broken, i never did find out how to switch the different sidebars on or off (i wanted them all on in all templates). also in the new version i could not get post controls to function correctly.
thanks to all those that have read this far, i really would like people to try the template and solve the open issue and suggest improvements. i am committed to see if i can make themler work for me, just have to balance this with making some money to keep the family!
regards steve

**Themler Team,** I invested much of my Holiday down time learning Themler. It has not been an easy process but I finally have a result that I might be able to use and have some understanding of the potential and limitations of Themler. Sure I had to live through you guys doing an upgrade, but progress continued well once I backed out of it and went back to the previous version. First I still feel your development plan seems to focus on making your tool more usable across platforms then exploiting the strengths of the different platforms. The lack of any module styles, inability to use menu page class or any method of linking Joomla menu ID's to specific Themler templates all feels like lost opportunity. I think you want to believe that developers will want to make a few custom pages with the text, images and formatting all added through Themler and then just use Joomla for the articles. I build large complex sites and fundamental to that is a template that lets me to change style, formatting and control items using the Joomla interface. So not having a left or a right module on one type of page is achieved by not putting a module in that position, not developing a custom page. Same goes for the other module positions. Then we get to the style issue. If I could create custom Module Suffix that I could design and edit in Themler I would see real advantages. But to have to create a specific module position in one class of templates really limits that flexibility. Anyhow my opinions are just mine. Back to substance and some hard questions. I built my Artisteer look alike template. In part to see if I could, but because I perhaps have thirty sites that currently use that product so some backwards comparability seemed like a good idea. I am amazed your team has not released an Artisteer clone template design. You should be much better than I have been and many of us could have started to use it immediately just copying it and changing the style as needed. I have added a few module styles in the form of art-nostyle, art-block and art-post. These were not hard to add as extra CSS code but make a real difference to how practicable the template is. I can now use a module position on one page to have a custom html module that will pick up the template formatting (art-block) but also use that module position for a module that its own style or need full size perhaps a promo module like Gavick GK5 News Pro (art-nostyle). The second generation template I made is attached. It is the result of a lot of stumbling and learning. My development plan is first get a basic Artisteer clone working, then use Themler's new functionality to get a custom homepage that has some more special features like parallax and such. I think I may be almost at that point. My next desire would be to be able to make custom landing pages to provide a more powerful site than just having all the blog pages look the same. Do not think I can do this right now because although I can create separate blog templates in Themler I do not see a way of calling them from Joomla. I solve this on my more custom templates by adding a "body-class" controlled by the menu ID. This lets me select the page design for specific menu items. So my hot list of enhancements for a Joomla focused Themler would be: **[1] Ability to define a Joomla Position (module) with a set of module suffix and style each of them using your excellent tool. The idea would be to have an extra property on your Joomla module position insert that you could create different module suffix each with unique styles and so have multiple styles defined for all joomla module positions. [2] Ability to select different "templates" (blog, blog1 etc.) by the Joomla menu ID, probably through a simple interface in the admin interface template back end. Something like mapping Menu ID to template name, if there is nothing there then use the defaults. This would set joomla apart from the other tools but at least play to a strength in your design.** I also made a change to the template I built for myself (Artisteer3) I added an extra module position manually called "content" then added some logic to all the /template files in the template code to switch out the Joomla content (echo '<jdoc:include type="component") whenever there was a module in the position content, then display that content. this lets me add module content in place of the joomla generated content at will. i use this to provide a more custom look to a blog page because joomla does not like to output nothing and this trick lets me preserve valid breadcrumbs. i will share this solution which is really a hack in another post. there were two things i could not get working in my template. **[3] unable to display breadcrumbs in any position except the top sidebar, the default. if i leave the breadcrumbs in the default place at the top of the content & sidebars it works, move it to any other place in a different sidebar, it displays in the themler editor but not on a real site. as a work around i can output the breadcrumbs to another standard joomla module and they seem to work fine. so i am unclear what that feature does? [4] there does not seem to be a posts control for dealing with the voting function. if you output the voting it displays really badly by default, so for now voting is not supported in the template.** otherwise the template seems usable. the module positions match that from artisteer with the names, so the menu needs to be in user 3. overall i found the previous version of the code more stable. my learning curve was longer because sometimes i would try and move a item in the outline list and it would not move, try to drag something in the layout and fail. but then i learnt that often this is a bug and that if you change the order and drag something else you can then get way you want. so now trial and error to move things has become normal, but as a beginner i kept thinking i had done things wrong. the new version seemed much worse and the use of the content & sidebars was just plain broken, i never did find out how to switch the different sidebars on or off (i wanted them all on in all templates). also in the new version i could not get post controls to function correctly. thanks to all those that have read this far, i really would like people to try the template and solve the open issue and suggest improvements. i am committed to see if i can make themler work for me, just have to balance this with making some money to keep the family! regards steve

Last edited 30 December 2015 by steve38

Joomla template Artisteer

Artisteer-2.zip

Vote to pay developers attention to this features or issue.

3 Comments

Order By: Standard | Newest

Support Team posted this 30 December 2015

Hi,

Thank you very much for your comments.

[1] Ability to define a Joomla Position (module) with a set of module suffix and style each of them using your excellent tool. The idea would be to have an extra property on your Joomla module position insert that you could create different module suffix each with unique styles and so have multiple styles defined for all joomla module positions.

We understand your idea.
Currently works in the following way:
You have Joomla position control. This control creates Joomla module position for modules.
Themler allows to create unique style for all modules in one position.
For example: all modules in left-1 position have red background and all modules in left-2 position have green background. Most of templates from themeforest, for example, work in the same way.
In general it's possible to assign green background to module in the left-1 using module class suffix. Themler uses Block control to stylize modules. Each block with default style (from Design Tab >> Styles) has the same class bd-block. If you change the style of the Blocks in the specific joomla positions this class will be changed too. For example:

So, all modules in left-1 position (red background) have bd-block-20 classes and all module in left-2 position (green background) have 'bd-block-10' classes. If you add bd-block-10 class as module class suffix to the module in left-1 this module will have green background.
Please note that module class suffix will be added to the existing class. In some cases you may achieve the combination of different styles. To reset the block style to default please use bd-block suffix.

In the future we plan to support the feature that allows to save Block style. This feature will be close to what you asked.

[2] Ability to select different "templates" (blog, blog1 etc.) by the Joomla menu ID, probably through a simple interface in the admin interface template back end. Something like mapping Menu ID to template name, if there is nothing there then use the defaults. This would set joomla apart from the other tools but at least play to a strength in your design.

Themler already supports the option to assign different templates to the joomla pages in the menu item settings:

here is description of all templates available in Themler by default:
http://answers.themler.com/articles/36343/how-to-work-with-templates-in-joomla-themes
this article described how to create custom templates and use them in Joomla; it should be helpful:
http://answers.themler.com/articles/10804/how-to-create-and-use-custom-templates

[3] unable to display breadcrumbs in any position except the top sidebar, the default. if i leave the breadcrumbs in the default place at the top of the content & sidebars it works, move it to any other place in a different sidebar, it displays in the themler editor but not on a real site. as a work around i can output the breadcrumbs to another standard joomla module and they seem to work fine. so i am unclear what that feature does?

Please navigate to Layout tab >> Above CMS content sidebar and disable "Hide if position is empty" option:

This should help.

[4] there does not seem to be a posts control for dealing with the voting function. if you output the voting it displays really badly by default, so for now voting is not supported in the template.

I've asked our developers to add appropriate control to the Themler themes for joomla.

Please let us know if you have any further questions.

Thank you,
Olivia

Hi, Thank you very much for your comments. > [1] Ability to define a Joomla Position (module) with a set of module suffix and style each of them using your excellent tool. The idea would be to have an extra property on your Joomla module position insert that you could create different module suffix each with unique styles and so have multiple styles defined for all joomla module positions. We understand your idea. Currently works in the following way: You have Joomla position control. This control creates Joomla module position for modules. Themler allows to create unique style for all modules in one position. For example: all modules in *left-1* position have *red* background and all modules in *left-2* position have *green* background. Most of templates from themeforest, for example, work in the same way. In general it's possible to assign *green* background to module in the *left-1* using module class suffix. Themler uses Block control to stylize modules. Each block with default style (from Design Tab >> Styles) has the same class `bd-block`. If you change the style of the Blocks in the specific joomla positions this class will be changed too. For example: !block-class.png! So, all modules in *left-1* position (red background) have `bd-block-20` classes and all module in *left-2* position (green background) have 'bd-block-10' classes. If you add `bd-block-10` class as module class suffix to the module in *left-1* this module will have green background. Please note that module class suffix will be added to the existing class. In some cases you may achieve the combination of different styles. To reset the block style to default please use `bd-block` suffix. In the future we plan to support the feature that allows to save Block style. This feature will be close to what you asked. > [2] Ability to select different "templates" (blog, blog1 etc.) by the Joomla menu ID, probably through a simple interface in the admin interface template back end. Something like mapping Menu ID to template name, if there is nothing there then use the defaults. This would set joomla apart from the other tools but at least play to a strength in your design. Themler already supports the option to assign different templates to the joomla pages in the menu item settings: here is description of all templates available in Themler by default: http://answers.themler.com/articles/36343/how-to-work-with-templates-in-joomla-themes this article described how to create custom templates and use them in Joomla; it should be helpful: http://answers.themler.com/articles/10804/how-to-create-and-use-custom-templates > [3] unable to display breadcrumbs in any position except the top sidebar, the default. if i leave the breadcrumbs in the default place at the top of the content & sidebars it works, move it to any other place in a different sidebar, it displays in the themler editor but not on a real site. as a work around i can output the breadcrumbs to another standard joomla module and they seem to work fine. so i am unclear what that feature does? Please navigate to Layout tab >> Above CMS content sidebar and disable "Hide if position is empty" option: !hide-empty-position.png! This should help. > [4] there does not seem to be a posts control for dealing with the voting function. if you output the voting it displays really badly by default, so for now voting is not supported in the template. I've asked our developers to add appropriate control to the Themler themes for joomla. Please let us know if you have any further questions. Thank you, Olivia

block-class.png

hide-empty-position.png

11 Posts

steve38 posted this 30 December 2015

Guys, appreciate the response. I hope you do not mind having a discussion about some of these because I believe we both have different perspectives and aspirations.
[1] Of course I understand that Themler will let me to style specific module positions differently, but equally you perhaps do not appreciate how being able to set any modules style through the current Joomla interface is important. I do not expect my customers admin staff to learn or use Themler, so they will continue to do all their editing and changes through the joomla interface. If I do capture the bd-block css for shortcuts I am not sure how simple it will be to have a bunch of module positions defined but probably not used for display but only to provide a set of module suffix then as you say adding one style over another will be complicated. I think my current work around will suit me and is an easy transition for my staff and customers.
[2] I hope we are failing to communicate over this item. I use the word template to mean a page created in Themler like blog or default. You seem to label them as blog template, even though they are a page within a template. But are you serious about telling everybody to load a different joomla template in order to get different page designs? The performance hit would be great, the size of the extra files would be an issue if you want say four or so different landing page designs? No that is not a solution or what I was suggesting.
[3] I will try the hide if position empty suggestion but am concerned that because I have more than one joomla position in that sidebar it will have two effects. First I do not want an empty breadcrumbs position on pages I do not want the breadcrumbs to display, second I may not have content in the other joomla positions and would not want them to display as empty. So this may just be a work around if you have just the breadcrumbs in a sidebar and are prepared to set up the page types without that sidebar when you do not want breadcrumbs.
[4] Appreciate the commitment to get a voting Post Tool.

Guys, appreciate the response. I hope you do not mind having a discussion about some of these because I believe we both have different perspectives and aspirations. [1] Of course I understand that Themler will let me to style specific module positions differently, but equally you perhaps do not appreciate how being able to set any modules style through the current Joomla interface is important. I do not expect my customers admin staff to learn or use Themler, so they will continue to do all their editing and changes through the joomla interface. If I do capture the bd-block css for shortcuts I am not sure how simple it will be to have a bunch of module positions defined but probably not used for display but only to provide a set of module suffix then as you say adding one style over another will be complicated. I think my current work around will suit me and is an easy transition for my staff and customers. [2] I hope we are failing to communicate over this item. I use the word template to mean a page created in Themler like blog or default. You seem to label them as blog template, even though they are a page within a template. But are you serious about telling everybody to load a different joomla template in order to get different page designs? The performance hit would be great, the size of the extra files would be an issue if you want say four or so different landing page designs? No that is not a solution or what I was suggesting. [3] I will try the hide if position empty suggestion but am concerned that because I have more than one joomla position in that sidebar it will have two effects. First I do not want an empty breadcrumbs position on pages I do not want the breadcrumbs to display, second I may not have content in the other joomla positions and would not want them to display as empty. So this may just be a work around if you have just the breadcrumbs in a sidebar and are prepared to set up the page types without that sidebar when you do not want breadcrumbs. [4] Appreciate the commitment to get a voting Post Tool.

Support Team posted this 11 January 2016

Hi,

Sorry for the delay,

[2] I hope we are failing to communicate over this item. I use the word template to mean a page created in Themler like blog or default. You seem to label them as blog template, even though they are a page within a template. But are you serious about telling everybody to load a different joomla template in order to get different page designs? The performance hit would be great, the size of the extra files would be an issue if you want say four or so different landing page designs? No that is not a solution or what I was suggesting.

Let's start from scratch.
Themler theme contains a number of default templates - NOT PAGES - (Home, Page, Post, etc). Template is an appearance of the Joomla page.
All templates automatically apply to Joomla pages by its type (Single Article, Category Blog Layout, etc).
The Blog you're referring to is a template applied to all Category Blog Layout pages.
In joomla terminology Themler theme is a template and Themler theme's template is a style. Joomla allows to make multiple styles in one theme.
Themler theme has multiple templates.
For example, You have two categories: Food and Drinks. You created two Category Blog Layout pages with a blog list of articles. And you need to make these pages to look different. You don't need two different themes. You need one theme with two Blog templates. After you created two Blog templates in Themler you need to create separate Style in Joomla that uses new Blog template and then apply this style to the appropriate Joomla page. You still have one theme (physically). But this theme has multiple styles (Themler templates). This is how joomla works. We're using core joomla feature.

[3] I will try the hide if position empty suggestion but am concerned that because I have more than one joomla position in that sidebar it will have two effects. First I do not want an empty breadcrumbs position on pages I do not want the breadcrumbs to display, second I may not have content in the other joomla positions and would not want them to display as empty. So this may just be a work around if you have just the breadcrumbs in a sidebar and are prepared to set up the page types without that sidebar when you do not want breadcrumbs.

Here is the difference between "Hine id empty" enabled and disabled:

If enabled, the Sidebar will be collapsed if no CMS widgets (modules, blocks) are inside.
If disabled, the Sidebar will not be collapsed if there is at least one control except Widget Area (Position, Region) inside this Sidebar. Even if no CMS widgets are inside.

If disabled and no breadcrumbs or joomla active modules are inside the Sidebar will be collapsed.

Please let us know if you have any other questions.

Thank you,
Olivia

Hi, Sorry for the delay, > [2] I hope we are failing to communicate over this item. I use the word template to mean a page created in Themler like blog or default. You seem to label them as blog template, even though they are a page within a template. But are you serious about telling everybody to load a different joomla template in order to get different page designs? The performance hit would be great, the size of the extra files would be an issue if you want say four or so different landing page designs? No that is not a solution or what I was suggesting. Let's start from scratch. Themler theme contains a number of default [templates][1] - NOT PAGES - (Home, Page, Post, etc). Template is an appearance of the Joomla page. All templates automatically apply to Joomla pages by its type (Single Article, Category Blog Layout, etc). The Blog you're referring to is a template applied to all Category Blog Layout pages. In joomla terminology Themler **theme** is a **template** and Themler theme's **template** is a **style**. Joomla allows to make multiple styles in one theme. Themler theme has multiple templates. For example, You have two categories: Food and Drinks. You created two *Category Blog Layout* pages with a blog list of articles. And you need to make these pages to look different. You don't need two different themes. You need one theme with two Blog templates. After you created two Blog templates in Themler you need to create separate Style in Joomla that uses new Blog template and then apply this style to the appropriate Joomla page. You still have one theme (physically). But this theme has multiple styles (Themler templates). This is how joomla works. We're using core joomla feature. > [3] I will try the hide if position empty suggestion but am concerned that because I have more than one joomla position in that sidebar it will have two effects. First I do not want an empty breadcrumbs position on pages I do not want the breadcrumbs to display, second I may not have content in the other joomla positions and would not want them to display as empty. So this may just be a work around if you have just the breadcrumbs in a sidebar and are prepared to set up the page types without that sidebar when you do not want breadcrumbs. Here is the difference between "Hine id empty" enabled and disabled: - If enabled, the Sidebar will be collapsed if no CMS widgets (modules, blocks) are inside. - If disabled, the Sidebar will not be collapsed if there is at least one control except Widget Area (Position, Region) inside this Sidebar. Even if no CMS widgets are inside. If disabled and no breadcrumbs or joomla active modules are inside the Sidebar will be collapsed. Please let us know if you have any other questions. Thank you, Olivia [1]: http://answers.themler.com/articles/36343/how-to-work-with-templates-in-joomla-themes

You must log in or register to leave comments