How should the main (default) Cotonti theme be built?

66.7% 10
0% 0
33.3% 5

15 Date 2011-12-19 10:28

Forums / Cotonti / Development / Poll: Default theme requirements

What do you want in the main Cotonti theme?

#1 2011-12-19 10:28

The default theme for Cotonti is a big point of discussion. Nemesis doesn't really appeal to many people, and the code is a mess. This is why we want to replace it with something that looks good and is easy to maintain and modify. My question is, how do you think it should be built? A common practice in webdevelopment is to use a CSS grid framework, such as or, or even a full HTML/CSS/JS framework such as Bootstrap. It could be a good thing to use one of those frameworks to aid in theme development, but I would like to know how the community feels about that before we just plainly start developing.

A purely semantic and basic theme will have a minimalistic codebase and a minimum of IDs and classes. This means it will perform very well, but it's also not very easy for beginners to modify because modifying it will mean having to add wrapper elements and change the CSS a lot. Basically this would be a great theme as-is, but not the best candidate for modification, unless you want to code everything yourself. Generally it lacks structure.

Using a CSS grid will simplify modification because it adds a framework on which to build. The downside is that the code won't be semantic, and you'll have to learn to work with the framework, not against it. Most probably the result will look better because everything is aligned to a grid.

Using a complete framework for HTML, CSS and JavaScript framework will lay down an even more elaborate framework to build upon. This will probably make development very streamlined, but also force you to dive into the framework's documentation.

Then there is the other discussion of HTML5 vs XHTML. Personally I'm all for using the latest techniques, including HTML5 and CSS3. Support for older browsers can be fixed with Modernizr or a similar script. Most CSS3 frameworks include this by default.

What do you think?

This post was edited by GHengeveld (2011-12-19 10:48, 12 years ago)
#2 2011-12-19 11:39

Nemesis has never been used or offered as a ready-made theme. It is a startup package with a clean and easily understandable code (recent "enhancements" to it will be removed soon). "The people" that treat it as a "non-appealing" or think that "the code is a mess" shall in fact switch to WP where everything comes out of the box and the code is really a mess. Once again: Nemesis is a startup package used to deploy a full-scale website. It shall never include any frameworks but it has all provisions to do that.

Sumisoon has been included in the package to provide for an out-of-the-box solution, so all questions go there. - создание сайтов, разработка плагинов и тем для Котонти
#3 2011-12-19 13:19

What about a basic theme with some nice features:

  • In the admin section you can upload and set a logo, along with the title, sub title and copyright notices
  • You can upload a new style file (css) to change the main colors, links and background images
  • You also have an option from the Admin section to directly edit the styles
  • Basic theme includes all tags needed to run a blog or community straight out of the box

I also remember a "blank" theme available on Neocrome which had most tags used for each template file, for example all {tags_used} in the index.tpl which could be extremely helpful to frontend developers and might make it easier for new comers...


#4 2011-12-19 15:23

I like the Bootstrap option more, it's a good framework. 

Having two themes in the default package is not something I agree with. I'd only put Nemesis until something better is made because the SymiSun theme is more than 2 years old. I had no time to maintain it back in the day, and naturally nobody was willing to do that for various reasons. Kort, I'm aware of your feelings towards me, but there's no need to mistype the theme's name on purpose. 

Coordinating another theme contest could spur some fresh works, but I can already rule myself out of participating in any such contests in the future. However, I'll gladly contribute an unofficial new theme around February most likely; this is when I'm expecting to have some free time. 

On a side note, I agree with Luke's remarks. 

It's not the hours you put in, but what you put in the hours.
#5 2011-12-19 15:42

why dont we just make a simple markup with all tags in it and delete all css stuff like we had on neocrome?
this worked well for my point of view. all that fancy css stuff can be added from the skinner...

i would go barebone!

URL shortener: <a href="!7AD5C7">!7AD5C7</a>
#6 2011-12-19 15:49

If you are a skinner you don't need a default theme, you can make your own from scratch.

I believe the issue here is how to appeal to novice users and newcomers to Cotonti. 

P.S. Loving your NES avatar; I used to have that console as a kid :)

It's not the hours you put in, but what you put in the hours.
#7 2011-12-19 16:37

Yeah but its not immediatly obvious what {tags} are available to use. I know there is a way of displaying these tags but you want to make it as easy as possible for new people. 

Mine and urlkiller's idea seems to be the same, however I am not suggesting a "blank" theme as the default but should be available, maybe in the document section, to aid learning...


#8 2011-12-19 18:20

@Stam; I had one too and still have it :) still running.

@lukgoh; yes same!

even as a designer you may not always make a layout from scratch. so you need a robust structure that you can use instead of redoing all tpls.
iam a hughe fan of less html markup and more css. what i meant is having a default skin like artic,
this skin should contain the most common used tags and its functionality (maybe even IF/ELSE statements to make it eyecandy).
But still, this theme should follow all valid W3C code and should use a logical layout like the 960grid (maybe something similiar but wit less css)

When looking at sed/cot sites i often saw roughly edited default skins. and most of the time only header/footer parts where changed. the rest stayed the same.
So if the HTML markup is nice the rest should fit in nicley with less or no modification since you change the basic parts still in header and footer.

if the css file has a good structrue and logical reference you should change colors and basic stuff only once. all other elements should inherite the layout from these basic settings. if you follow that you would end up with a very clear and easy to read css structure that can be a good start.

i also would recommend using a css-reset "hack?" to reset all elements. i, for example, put even the stylesheets for the administration in another css file and load it seperatly to save a little bit of KB and make it more readable for everyone.

this is more aimed to teach people how to work with the skins
but also gives a fresh and clean start (without forgetting the cool stuff) for an experienced designer/new project.
(I hated the bCap cCap a lot with the old skin. ok it was nice for tables but a pain in the ass at the same time)

if this example skin is overloaded with librarys like bootstrap it becomes maybe more appealing to the eye
but looses a lot of its modablility because you are forced to use the libaray, if you dont want to redo all css (it's fucking nice though).

So in the end we should come up with a bare example and a rough and solid html structure that can be made to anything with css only this can be used then as a fresh start or as a learning sample for newcomers.
(much alike the css zen garden)

another Topic should be a nice Release Skin for the dl package.

Added 1 minute later:

lol, or it can be used for mobile browsers too if you forget the css file :D

URL shortener: <a href="!7AD5C7">!7AD5C7</a>
This post was edited by urlkiller (2011-12-19 18:34, 12 years ago)
#9 2011-12-19 21:58

i simply say.... why not have both skins  1) Barebone and 1 based on something like bootstrap


==- I say: Keep it EZ -==
#10 2011-12-19 22:58

Reactions here seem to prefer the plain semantic HTML5 theme. Having a semantic theme was my first choice too, but I also see the benefits of using bootstrap. I agree with ez that we should idealy have both (first the semantic one). However we're probably not going to include both in the package, and so the other should just be made available for download.

#11 2011-12-20 05:41
#32165 Kort:

Once again: Nemesis is a startup package used to deploy a full-scale website.

Never had a chance to express gratitude for Nemesis - so, using this opportunity. Thank you, Kort, for your investment in Nemesis - it became foundation for many my themes!

I really glad this topic arouse! I vote for HTML5/CSS3 theme. Using grids will be natural in close future, so better using it also.

I would really like to see the theme as minimalistic - presenting elements in their fundamental purpose. Also, it is wise to consentrate on mobile devices ("mobile first"). There is old stat that 25 percent of mobile internauts in the US never or rarely use the desktop. It would be great to have minimum of Responsive Design in our basic theme.

I believe (and see from my experience) - the more experience we put in the basic theme - the more advantages got new skinners - which will lead to more website with Cotonti + technically good layouts. This is investment in future of Cotonti.

#12 2011-12-20 18:37
#32182 Eugene:
I believe (and see from my experience) - the more experience we put in the basic theme - the more advantages got new skinners - which will lead to more website with Cotonti + technically good layouts. This is investment in future of Cotonti.



this is true..

Learned alot from cotonti skins/themes and community
#13 2011-12-25 22:58

As my own - I use CSS framework for all my skins. It's a "blueprintcss". It's simple and lightweight enought and still very usefull as CSS framework. It has module structure and you can select only that you need.
On practice it can be used (loaded) with already completed skins like "Nemesis" (not specially designed for it) with no (or light) modification.

For default skin as it be a "new face" of Cotonti and will provide comunication with new users of CMS it must be:

  • appeal enought to attract new users to CMS (not an oldschool design)
  • not using state of the art or advanced technology. It may use some HTML5 tags or CSS3 but it must be valid for using it on rare or old style systems (ex. IE>=7,Opera etc.). "OldStyle" user can must have working skin not ugly mess of unsupported features.
  • not complicated and multi functional. Better it would be a simple blog style but robust and usefull rather heavy multifunctional combine. (see Wordpress)
  • support all modules and plugins in a base package

Default skin may conform Cotonti new users requirements. In two words - attract and satisfy.

Beside it, Coronti need some kind a "template skin" for beginner developers. So they can easily upgrade it for their needs. It may consits no grafic files at all, the main target is to give developers flexible blocks structure.

Добавлено 1 месяц спустя:

In addition to «blueprintcss» I write above, look at:

- «Yaml» CSS framework version 4.

- «Bootstrap» CSS framework version 2.

Both of it has a great option of «Responsive design» (components are scaled according to a range of resolutions and devices to provide a consistent experience, no matter what).
правильный хостинг —
This post was edited by Macik (2012-02-07 15:25, 12 years ago)