HTML5 Boilerplate

Topic for html5 boilerplate theme for cotonti

milleja46	#1 2013-01-27 13:09
Members Thanked: 1 time	Hi, I started working on a theme for Cotonti based on the html5 boilerplate. The theme is basically symisun stripped down and add in the boilerplate. I also tried to redo some of the code in the theme to fit html5 tags where id="header" or id="footer" is no longer nesscary at the top and bottom of the page. Since both tags can be replaced with a header and footer tag. I have not made a screenshot because it is so stripped down and is just the same pages with almost no styling what so ever. Tell me what you think and where I need to improve it. The theme: (EDIT: see my reply for the file) Compatibility: Siena only. I started with siena so focusing on a older version would be a undertaking that I can't do coming into this cms at this point. Changelog: 0.1: First version framework 0.1.1: Rewrite into nemesis TODO: Create tpls for news and pages: News for the index of news that uses the article, section, and other tags that will organize it.Pages will be a simple section block. Most of these such tags will just be organizing tools for the code so that it is readable. Delete unnesscary Nemesis styling Here is the link to download this theme from github
This post was edited by milleja46 (2013-02-04 15:40, 11 years ago)

milleja46

#1 2013-01-27 13:09

Hi, I started working on a theme for Cotonti based on the html5 boilerplate. The theme is basically symisun stripped down and add in the boilerplate. I also tried to redo some of the code in the theme to fit html5 tags where id="header" or id="footer" is no longer nesscary at the top and bottom of the page. Since both tags can be replaced with a header and footer tag. I have not made a screenshot because it is so stripped down and is just the same pages with almost no styling what so ever. Tell me what you think and where I need to improve it.

The theme: (EDIT: see my reply for the file)

Compatibility: Siena only. I started with siena so focusing on a older version would be a undertaking that I can't do coming into this cms at this point.

Changelog:

0.1: First version framework

0.1.1: Rewrite into nemesis

TODO:

Create tpls for news and pages: News for the index of news that uses the article, section, and other tags that will organize it.Pages will be a simple section block. Most of these such tags will just be organizing tools for the code so that it is readable.
Delete unnesscary Nemesis styling

Here is the link to download this theme from github

This post was edited by milleja46 (2013-02-04 15:40, 11 years ago)

Trustmaster	#2 2013-01-27 13:47
Administrators Thanked: 263 times	Hi and thanks for joining our community! First here's the hint that I have already given via PM that might be helpful for other newcomers too: It is generally recommended to start with Nemesis theme rather than Symisun, because Nemesis is made for development purposes and is a lot more simple visually and markup-wise. You might be puzzled by the fact that there are so few TPL files in nemesis folder, but in fact it has most of its templates present as "fallback" templates in the "tpl" subfolder of each module or plugin in the "modules" and "plugins" folders. These templates are kept clean and up2date, whereas Symisun may slightly lag behind. Here are a few links that might be extremely helpful when developing a new theme: Template engine syntax Getting the full list of available tags and blocks There is also TPL Tags database but it is not as complete as the method from the previous link Feel free to ask questions if any and keep us posted on the progress on this theme. May the Source be with you!

Trustmaster

#2 2013-01-27 13:47

Administrators
Thanked: 263 times

Hi and thanks for joining our community! First here's the hint that I have already given via PM that might be helpful for other newcomers too:

It is generally recommended to start with Nemesis theme rather than Symisun, because Nemesis is made for development purposes and is a lot more simple visually and markup-wise. You might be puzzled by the fact that there are so few TPL files in nemesis folder, but in fact it has most of its templates present as "fallback" templates in the "tpl" subfolder of each module or plugin in the "modules" and "plugins" folders. These templates are kept clean and up2date, whereas Symisun may slightly lag behind.

Here are a few links that might be extremely helpful when developing a new theme:

Template engine syntax
Getting the full list of available tags and blocks
There is also TPL Tags database but it is not as complete as the method from the previous link

Feel free to ask questions if any and keep us posted on the progress on this theme.

May the Source be with you!

milleja46	#3 2013-01-27 15:07
Members Thanked: 1 time	Update: http://www.cotonti.com/datas/users/html5boilerplate_2845.zip v0.1.1 This is actually reworked from nemisis, and has all the html5 boilerplate things added in. Should actually be almost ready, might need a few adjustments to get it up to html5 standard. But is basically the same theory. Please leave feedback and tell me where this may still need to improve. I know there may still be kinks in it, but it seems to be functional and is html5 for the latest stable Cotonti.

milleja46

#3 2013-01-27 15:07

Members
Thanked: 1 time

Update: http://www.cotonti.com/datas/users/html5boilerplate_2845.zip v0.1.1

This is actually reworked from nemisis, and has all the html5 boilerplate things added in. Should actually be almost ready, might need a few adjustments to get it up to html5 standard. But is basically the same theory.

Please leave feedback and tell me where this may still need to improve. I know there may still be kinks in it, but it seems to be functional and is html5 for the latest stable Cotonti.

Trustmaster	#4 2013-01-27 17:27
Administrators Thanked: 263 times	Do you plan adding any visual styling to it or you want to keep it blank? At this stage it looks a bit odd. May the Source be with you!

milleja46	#5 2013-01-27 17:32
Members Thanked: 1 time	It's meant to be a completely barebones theme. Only to be used as a starting point. So there will really not be anything visually. Added 14 minutes later: Any cleanup that is still needed? I'm still working on the page and news templates.. Added 48 minutes later: Ok making things easier and put the theme on github ahead of the time that I wanted to. That way I don't have to create a zip except when I feel that it's nesscary for a release. Hopefully this should be up to v1 status soon Edit: Whoops just realized I forgot the link - Here it is
This post was edited by milleja46 (2013-01-29 11:59, 11 years ago)

milleja46

#5 2013-01-27 17:32

Members
Thanked: 1 time

It's meant to be a completely barebones theme. Only to be used as a starting point. So there will really not be anything visually.

Added 14 minutes later:

Any cleanup that is still needed? I'm still working on the page and news templates..

Added 48 minutes later:

Ok making things easier and put the theme on github ahead of the time that I wanted to. That way I don't have to create a zip except when I feel that it's nesscary for a release. Hopefully this should be up to v1 status soon

Edit: Whoops just realized I forgot the link - Here it is

This post was edited by milleja46 (2013-01-29 11:59, 11 years ago)

Trustmaster	#6 2013-01-28 10:05
Administrators Thanked: 263 times	Now that you've explained that it is tended to be bare bones it is more clear. I recommended you to start with Nemesis but it is not really "bare bones", it has some flesh on them. So to make it even cleaner you might want to get rid of its classes, e.g. "block", "admin", "bullets", "coltop", "widthX". You can also move the things around as you wish or even remove them. What's important to know is that some tags are only available in specific block, e.g. a tag {PAGE_ROW_TITLE} is likely to be available only inside the BEGIN: PAGE_ROW block. Good start with page templates, but there's a problem: the folder names must be in lower case basause path searches are case-sensitive on most servers. So it should be modules/page rather than Modules/Page. May the Source be with you!

Trustmaster

#6 2013-01-28 10:05

Administrators
Thanked: 263 times

Now that you've explained that it is tended to be bare bones it is more clear.

I recommended you to start with Nemesis but it is not really "bare bones", it has some flesh on them. So to make it even cleaner you might want to get rid of its classes, e.g. "block", "admin", "bullets", "coltop", "widthX". You can also move the things around as you wish or even remove them. What's important to know is that some tags are only available in specific block, e.g. a tag {PAGE_ROW_TITLE} is likely to be available only inside the BEGIN: PAGE_ROW block.

Good start with page templates, but there's a problem: the folder names must be in lower case basause path searches are case-sensitive on most servers. So it should be modules/page rather than Modules/Page.

May the Source be with you!

milleja46	#7 2013-01-28 12:03
Members Thanked: 1 time	Well that makes sense. As well I don't mind collaborating on this theme if someone wants to join in on it in the future. I was just skeptic to remove compenents on pages in case I needed it somehow or something but the styling things I can see. Added 24 hours later: Any suggestions so far for it? Otherwise I think I might go ahead and release it as is and keep working on it after that...(even though I have plans to take it a step further with a new theme that will add in bootstrap but only to the point of make it look like a bootstrap theme with the default styles)
This post was edited by milleja46 (2013-01-29 11:52, 11 years ago)

milleja46

#7 2013-01-28 12:03

Members
Thanked: 1 time

Well that makes sense. As well I don't mind collaborating on this theme if someone wants to join in on it in the future. I was just skeptic to remove compenents on pages in case I needed it somehow or something but the styling things I can see.

Added 24 hours later:

Any suggestions so far for it? Otherwise I think I might go ahead and release it as is and keep working on it after that...(even though I have plans to take it a step further with a new theme that will add in bootstrap but only to the point of make it look like a bootstrap theme with the default styles)

This post was edited by milleja46 (2013-01-29 11:52, 11 years ago)

Twiebie	#8 2013-01-29 11:58
Team Thanked: 74 times	Not sure if the one on GitHub is your latest build, if so - notice what Trustmaster pointed out one post earlier: #36894 Trustmaster: Good start with page templates, but there's a problem: the folder names must be in lower case basause path searches are case-sensitive on most servers. So it should be modules/page rather than Modules/Page.

milleja46	#9 2013-01-29 11:59
Members Thanked: 1 time	Well I just committed and pushed a minute ago Added 2 days later: Well work has started on the bootstrap addition and I'll have a working copy of that soon hopefully. But maybe this one can be posted with the link to the github as is. Added 5 days later: Update: I have removed almost all of the unnesscary stuff, and this is more barebones than it was before. I think I am ready to release to the general public as 1.0 it can be downloaded from the github link in the first post. Feedback is welcome as always. This is NOT a theme meant to be used for anything but as a starting point. I will be updating the bootstrap barebones as such with this code and see what comes of it.
This post was edited by milleja46 (2013-02-04 15:38, 11 years ago)

milleja46

#9 2013-01-29 11:59

Members
Thanked: 1 time

Well I just committed and pushed a minute ago

Added 2 days later:

Well work has started on the bootstrap addition and I'll have a working copy of that soon hopefully. But maybe this one can be posted with the link to the github as is.

Added 5 days later:

Update: I have removed almost all of the unnesscary stuff, and this is more barebones than it was before. I think I am ready to release to the general public as 1.0 it can be downloaded from the github link in the first post.

Feedback is welcome as always. This is NOT a theme meant to be used for anything but as a starting point. I will be updating the bootstrap barebones as such with this code and see what comes of it.

This post was edited by milleja46 (2013-02-04 15:38, 11 years ago)