[Theme] Simplicity (SMF v1.0.5 - 1.1RC2)

[Miraenda]

Very good job Apnomis

I like your go up button at the bottom to go to the top of the page as well as that you do have the pages listed down at the bottom.  Some of the pages due to a lot of graphics load more slowly than the default theme, but otherwise an excellent adaptation.

[Apnomis]

Thanks. I'm thinking of expanding things further in the future but I'm happy with it for now, I'll probably set up a beta copy to play with some more!

I'm thinking about having the columns on the board index page being slightly different to the rest of the site, as currently they are quite thick to fit the board names on, and this size is replicated throughout the site. But I may set up a new option for frontleftbar or something so I can specify a different size. I'm actually wondering what it would look like if I made the board index board list wider and included some more information, but still have enough room in the centre for recent topics, but I'm not sure what it would look like it may spoil the flow of the site and maybe make the main page look too clutered. But I'll probably try it just to see!

one thing I do need to change is the level of info on the message listing - things like page numbers, last reply date, who replied last etc. But I've not decided how best to present it yet.

I realise that it isn't quite as streamlined as the original Simplicity was meant to be. But that was never my intention, I've never wanted a cut down simple design, the only reason I wanted to base my design on Simplicity is because: a) I think Bloc is an excellent theme designer who makes high quality themes, and b) I loved the column design, it was fresh and different. For me it was never about Simplicity, it was all about the Columns!

[bloc]

I think you did a good job, Apnomis. It is refreshing this one too, fast loading and colorwise easy to navigate / read. I like what you did with the "poster" section in Display, a tad better than the original I might add.

As for the setting the width of columns in BaordIndex, you could just hardcode values just there, like the first Simplicity had.

It quite amazing how people has modified this theme to suit their own site, and done a really good job of it too! I must have done something right on this one...

I am planning more free themes and have a few ideas...but do you think its desirable with more CSS based, less images - type of themes?

[Apnomis]

Thanks for the compliment Bloc!

I changed the poster info as I thought the default took up too much space, the way I have it now is optimised for people to have 100x100 avatars, so they fit perfectly within the height of the box. I still need to make some new icons for the contact options though, I would like them to be of a more uniform design.

Another little thing I quite like is the users viewing the board and users viewing a thread in the left pane, as it sort of ties in nicely with the all users online section in the same place on the front page. Along with the colour changes they were the first changes I made, the rest were more specific customisations, like adding the upcoming calendar and a poll in the right bar, adding some new BBCode, changing the design of the calendar to be clearer (not all grey), changing some of the text buttons to icons, adding the second nav tree, changing the column width chooser to pixels instead of % so it displayed properly in Firefox etc etc etc. I took quite a few things from the Tips & Tricks and Mod sections too like the ablity to distuingish which guests are bots in the Who's Online section, adding karma tables in the stats section, the list goes on! And to think I had never worked with PHP script before I started this theme, I've learnt a lot about how PHP works doing it!

As for what theme you should do next, I don't know as I'm happy with the one I've got, but you definitely seem to have a midas touch with theme design I don't think you've done a bad one yet! I suppose the success of Simplicity shows that people appreciate designs that "are outside the box", your challenge is to think of a new way to display the same information!

[Miraenda]

I think to have additional CSS-based, less graphics and unique themes like this being developed would be awesome.  I love this theme so much.  It is what made me decide to go with SMF in the long-run after trying out phpBB, vBulletin, IPB, punBB and MX Projects.  SMF is great, and this theme is fantastic.

[destalk]

It quite amazing how people has modified this theme to suit their own site, and done a really good job of it too! I must have done something right on this one...

I am planning more free themes and have a few ideas...but do you think its desirable with more CSS based, less images - type of themes?

You did a lot right on this one. Now that Recent Topics is implemented so well also, I'd say this was the best theme ever. Now, if only the "next page..." links were at the bottom of each column, as well as at the top, it would be perfect...

Generally, I find the "more CSS based, less images" based themes to be far prefererable. I think that the biggest 'fault' with most themes is that they are overcomplicated (it's also the problem with most designs full-stop - but that's another subject). A lot of forum themes have some outstanding graphics and funky buttons, but it can result in completely smothering the content of the forum. And let's face it, the whole point of a discussion forum is to... discuss. That's why I think that the Guardian/simplicity/SMF approach is so effective - the beauty of the design is that it allows the content of the threads and posts to shine through. Whilst still looking stylish. And, as you say, it is also easy to customise to look good - a tribute to SMF.

I would say that the best approach to start with is, 'how would this forum design help my visitors to find their way around and explore parts of the forum that they might otherwise not visit'? The simplicity theme does this well IMO.

[bloc]

Thanks, destalk. Food for thought.

..about the "next page" links, you don't have to wait for the next update. I will post the changes here for you. Hold on. Just want to test it first.

Ok, in Display.template.php find this:

Code Select Expand

                // Show the member's signature?
                if (!empty($message['member']['signature']) && empty($options['show_no_signatures']))
                        echo '
                                    <br /><div style="margin-top: 4px; padding-top: 4px; border-top: dashed 1px #909090; overflow: auto; width: 100%; padding-bottom: 3px;" class="signature">', $message['member']['signature'], '</div>';
              echo '</td></tr></table>';
      }

echo '<a name="lastPost"></a>
<div style="padding-top: 4px; padding-bottom: 4px;">', theme_show_mod_buttons(' | '), '</div>';

        if (!empty($options['display_quick_mod']) && $options['display_quick_mod'] == 1 && $context['can_remove_post'])
                echo '
        <input type="hidden" name="sc" value="', $context['session_id'], '" />
</form>';
        echo '


replace with this:

Code Select Expand

                // Show the member's signature?
                if (!empty($message['member']['signature']) && empty($options['show_no_signatures']))
                        echo '
                                    <br /><div style="margin-top: 4px; padding-top: 4px; border-top: dashed 1px #909090; overflow: auto; width: 100%; padding-bottom: 3px;" class="signature">', $message['member']['signature'], '</div>';
              echo '</td></tr></table>';
      }

echo '<a name="lastPost"></a>
<div style="padding-top: 4px; padding-bottom: 4px;">', theme_show_mod_buttons(' | '), '</div>';
        // Show the topic information - icon, subject, etc.
        echo '<hr><div style="padding-top: 7px;"><img src="', $settings['images_url'], '/topic/', $context['class'], '.gif" alt="" align="middle" /><span class="smalltext"> &nbsp;(', $txt[641], ' ', $context['num_views'], ' ', $txt[642],')
         '.$context['page_index'].' </span></div>';

        if (!empty($options['display_quick_mod']) && $options['display_quick_mod'] == 1 && $context['can_remove_post'])
                echo '
        <input type="hidden" name="sc" value="', $context['session_id'], '" />
</form>';
        echo '


[destalk]

Thanks Bloc.

Unfortunately, I get all sorts of errors with that including a "Template Parse Error!".

[bloc]

I will send the file to you in an email..probably some small error in a comma or something in this post.

[Miraenda]

I did wonder if additional colors were going to be offered for this theme since it was mentioned in this thread somewhere or suggestions for additonal ones were anyway...If that might be in the works at some point, I was going to request an orange-based one as well as purple/lilac as other possibilities as well as a red one.  In fact, the brown theme has a css file called red.css, which I wondered if perhaps red was originally going to be used instead?

Just an idea as I would love to have some more colors with this theme, but it isnt any priority request either as validation and the other updates are much more important concerns, and the current color choices are great already.

[destalk]

I will send the file to you in an email..probably some small error in a comma or something in this post.

Thanks Bloc, in your own time. The World won't end if I have to wait until you do the validating. At least I hope the world won't end. 

[bloc]

On its way.

[destalk]

Received and works like a dream, thanks.

[bloc]

Update:
There has been some changes in several files to get the theme validating, but stylesheets should be intact.

See first post for details on the update.

[Miraenda]

Looks good, and thanks for the peach addition for the color

I did wonder if a breadcrumb trail is going to be added later on (I'd mentioned it a few pages ago)? If not, I'll go about determining how to add to the template on mine. It's possible, of course, you might not want to add too much more, which I can see as right now the page loads quickly and it looks great as it is.

[Apnomis]

When you say breadcrumb trail do you mean a link tree? If you want it to appear like it does on my modded version of this theme: www.forums3d.com let me know and I'll tell you what to change, unless Bloc beats me to it! It's a really easy change to make...

[Apnomis]

Bloc this may be a bit too much to ask, but I don't suppose you kept a change list as to what you changed to validate the theme? If not everything then just which files you updated?

I don't really want to do all my changes again, because I suspect I've changed more things in my modded theme than you've changed validating. So I think it would be easier for me to add your changes to mine rather than visa versa.

I could always go through every file line by line and do it that way, but I would prefer not to!

Any pointers you could give would be great, or just say if you've changed too much to be able to do that.

I suppose it's not the end of the world if my theme isn't validated just yet...

[bloc]

uhm..not an exact list...and your modifications also probably will have to be validated...

But: Index.template.php + BoardIndex.tempalte + MessageIndex + Display, all contain an error when showing the "UserTools" type of titles - they are followed by a </span > with a </b > AFTER it, it should be BEFORE it , because the <b > is started AFTER <span >. A slip up, and since I copied that bit many places, it will have to be corrected many places.

There were also some trouble with missing, and too many <div ></div > in the index so i had to rewrite it some.

As you understand nothing staggering wrong, but more annoying bugs, and of course wrong to the validator. 

[Miraenda]

Apnomis, it is likely the link tree you are referring to yes.  I did a pic a while back asking about it:

http://anythingeverything.org/images/ae2.png

The breadcrumb trail duplicates the one at the top and the page views (which were added) are also duplicated at the bottom above the quick reply in the picture.  If you could note the location to make the change to include it, that would be great as I think it is easier to use than a jump box just to get back to the main forum home for one.

[Apnomis]

Apnomis, it is likely the link tree you are referring to yes.  I did a pic a while back asking about it:

http://anythingeverything.org/images/ae2.png

The breadcrumb trail duplicates the one at the top and the page views (which were added) are also duplicated at the bottom above the quick reply in the picture.  If you could note the location to make the change to include it, that would be great as I think it is easier to use than a jump box just to get back to the main forum home for one.

Well this is how I did it:

Find in index.template.php

Code Select Expand

         // The "key stats" box.
         echo '<br /><span style="font-size: 18px;letter-spacing:-1px;color: #b0b0b0;"><b>'.$txt['SIMPLE_Tools3'].'</b></span><span style="font-family: arial, sans-serif; font-size: 18px;letter-spacing:-1px; color: #000000;"><b>'.$txt['SIMPLE_Tools4'].'</b></span><br /><hr />
                   <span class="smalltext"><b>'. $modSettings['totalMessages']. '</b> ', $txt[95], ' <br /> <b>', $modSettings['totalTopics'], '</b> ', $txt[64], '  <br /><b>', $modSettings['memberCount'], '</b> ', $txt[19], '<br />
                                                         ', $txt[656], ': <b> <a href="', $scripturl, '?action=profile;u=', $modSettings['latestMember'], '">', $modSettings['latestRealName'], '</a></b><br />
                  <br /><a href="http://www.php.net/" target="_blank">', $txt['powered_by_php'], '</a>
                  <br /><a href="http://www.mysql.com/" target="_blank">', $txt['powered_by_mysql'], '</a>
                  <br /><a href="http://validator.w3.org/check/referer" target="_blank">', $txt['valid_xhtml'], '</a>
                  <br /><a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">', $txt['valid_css'], '</a>
                  </span>';


      echo '</td></tr></table>';


        // Show the "Powered by" and "Valid" logos, as well as the copyright.  Remember, the copyright must be somewhere!



Replace with:

Code Select Expand

         // The "key stats" box.
         echo '<br /><span style="font-size: 18px;letter-spacing:-1px;color: #b0b0b0;"><b>'.$txt['SIMPLE_Tools3'].'</b></span><span style="font-family: arial, sans-serif; font-size: 18px;letter-spacing:-1px; color: #000000;"><b>'.$txt['SIMPLE_Tools4'].'</b></span><br /><hr />
                   <span class="smalltext"><b>'. $modSettings['totalMessages']. '</b> ', $txt[95], ' <br /> <b>', $modSettings['totalTopics'], '</b> ', $txt[64], '  <br /><b>', $modSettings['memberCount'], '</b> ', $txt[19], '<br />
                                                         ', $txt[656], ': <b> <a href="', $scripturl, '?action=profile;u=', $modSettings['latestMember'], '">', $modSettings['latestRealName'], '</a></b><br />
                  <br /><a href="http://www.php.net/" target="_blank">', $txt['powered_by_php'], '</a>
                  <br /><a href="http://www.mysql.com/" target="_blank">', $txt['powered_by_mysql'], '</a>
                  <br /><a href="http://validator.w3.org/check/referer" target="_blank">', $txt['valid_xhtml'], '</a>
                  <br /><a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">', $txt['valid_css'], '</a>
                  </span>';


      echo '</td></tr></table>
      <table width="100%" cellspacing="5" cellpadding="5" border="0" >
      <tr><td colspan="3" class="smalltext2" style="padding: 0px 40px 5px 40px;">&laquo; ';
      theme_linktree();
      echo ' &raquo;</td></tr>';


      echo '</td></tr></table>';


        // Show the "Powered by" and "Valid" logos, as well as the copyright.  Remember, the copyright must be somewhere!



I've based this find and replace on the validated version as it's changed slightly since my version of the file, should still work the same though.

I don't know if that's the right/best way to do it, but it worked for me!