Setting up HopelessArt Theme

Please notice, if you are using Croogo and activated the Default- or Minimal- theme ( both are developed by Fahad Ibnay Heylaal ), that the Hopelessart- theme is a little bit complexer to set up as the both other themes i have mentioned above.

The Regions

The HopelessArt- theme has some more regions than you would expect. Here is a list of all regions in HopelessArt:

• header-right
• right
• center
• footer

So, the first thing you have to do, after installing the HopelessArt theme via admin panel -> extensions -> upload, is to create the missing regions header-right, center and footer. You may have a block in the 'right' section, called search. This block have to be in the header-right section. So go into the admin panel and set the region of the search block to header-right.

The next thing is the big banner on the promoted page. Actually i planned to integrate something like jCarousel for some cool effects with the banner, but it makes it difficult to keep the theme general. I'm working on it. To modify this picture, create an image (958 x 300) , call it 'promoted_banner.jpg' and move it into:

your_app/app/views/themed/hopelessart/webroot/img/

The promotion text blocks

To add some textblocks under the banner like you can see on the screen shot, add some blocks and set their regions to center. I think three center blocks are perfect.

The footer region is similar to the center region. You can add some blocks to the footer region and put there some information like the latest posts or an archive. I prefer to use maximal five blocks for the footer region.

Social Media

Now you know everything about the regions by the HopelessArt- theme, you need to know. But there are still some cool features I would like you to know. As you can see on the screenshot, there are some social-bookmarks like RSS and Twitter. The HopelessArt- theme supports the following social-bookmarks:

• delicious
• designbump
• designfloat
• digg
• dzone
• email
• rss
• stumbleupon
• technorati
• twitter

To add or remove a social-bookmark, you have to edit the default layout of HopelessArt. Open default.ctp in

your_app/app/views/themed/hopelessart/layouts

and go to line: 58. You should see the following code:

echo $this->Custom->socialBookmark('rss', '/nodes/promoted.rss');
echo $this->Custom->socialBookmark('twitter', 'http://twitter.com/#');

The code-snippet CustomerHelper::socialBookmark($type, $link) generates all social-bookmarks you would like to have if they are available. The first param is the type of social-bookmark. Take one of the list above. The second param is the link, maybe the link to your twitter timeline.

The Fancybox

Another cool feature is the jQuery-fancybox-plugin i have integrated. All you have to do to run the fancybox for all images in your blogposts, is to edit your blogpost in HTML-Mode via TinyMCE in the admin panel. Wrap your embedded image with an anker-tag. Then add to your anker the class: "fancyimage". Thats all. Here is a little example:

<a class="fancyimage" href="link_to_your_image">
<img src="source_to_your_image" alt="" />
</a>

The fancybox works in view-, promoted- and index- view.

General Usage

Please notice, that the HopelessArt- theme uses the "excerpt" field in nodes, to show an excerpt in the index- view for each blogpost. So if you add a blogpost, or something like this, you have to use the excerpt field, to see anything on yout site.

These are the most important features by HopelessArt. Have fun with it!

If you have any questions, bugs or improvement suggestions feel free open a ticket on github or send me an email.