• Join Now
  • Sign In
  • Cart
  • Instant Setup
  • Download
Logo
  • About
    • For Developers
    • For Agencies
    • For Designers
    • For Anyone
    • Testimonials
    • Showcase
    • Our Philosophy
    • Blog
    • Instant Setup
  • Community
    • Members
    • Forums
    • Chat
    • Karma
    • International
    • Jobs
    • eNewsletters
  • Developers
    • Download concrete5
    • Join Beta Team
    • Translate concrete5
    • Bug Tracker
    • Submit to Marketplace
    • Code Submissions
    • News
    • Community Leaders
    • Related Projects
  • Marketplace
    • Add-Ons
    • Themes
    • Hosting
    • Training
    • Add-on Installation
    • Deal Of The Day
    • Swag
  • Enterprise
  • Documentation
    • Getting Started
    • Editor's Guide
    • Learn concrete5
    • Developers Index
    • How-Tos
  • How-Tos

Create a News system using Composer

Posted byhaan in Developers on Mar 11, 2012.
17 people like this.

This guide explains how we can use the Composer of Concrete5 to create a fully working News system. Each news will be composed of the following elements: - Title - Publishing date - Short formatted preview text - Thumbnail - Main formatted news text By following this guide, it’s easy to extend this list to include even more elements.

1. Create custom attributes

The custom attributes are necessary for saving non-standard information such as the formatted preview text or the thumbnail.

  1. Go to “Dashboard → Pages & Themes → Attributes”
  2. Optional: create a new set called “News” by clicking on “Manage sets” so we can more easily organize our newly created attributes.
  3. Create an attribute of type “Textarea”:
    1. Handle: news_description
    2. Name: News Description
    3. Set: News
    4. Input Form: Rich Text - Simple
  4. Create an attribute of type “Image File”:
    1. Handle: news_thumbnail
    2. Name: News Thumbnail
    3. Set: News

2. Create a new page type

The new page type is a template that serves as a model for future news. Each news will have its own page of this type that will be created from this model.

  1. Go to “Dashboard → Pages & Themes → Page Types”
  2. Click on “Add a Page Type”:
    1. Name: News
    2. Handle: news (possible to theme with a news.php file in theme folder)
    3. Default Attributes to Display: News Thumbnail and News Description

3. Create a “news list” page

The “news list” is the page where we will display a list of all our news. Additionally, new news pages will be created as subpages of this page.

  1. Go to “Dashboard → Full Sitemap”
  2. Create a new page called “News” with whatever page type you like

4. Enable composer to write news

I followed the guide that I found here to be able to write news using the composer feature of concrete5. The composer allows for the creation of new pages of a certain type without leaving the backend (Dashboard) of concrete5.

  1. Go to “Dashboard → Page Types”
  2. Click on “Defaults” for the “News” page type you created
  3. Enable “Edit” mode
  4. Create composer-editable page content by repeating the following steps as often as you like:
    1. Add a new block of type “Content” to your page
    2. Click on the newly created content block and chose “Composer settings”
    3. Check “Include block in Composer” checkbox and give the content block a meaningful name
  5. Leave “Edit” mode and publish your changes
  6. Go to “Dashboard → Page Types”
  7. Click on “Composer” for the “News” page type you created:
    1. Check “Yes, include this page type in Composer.”
    2. Chose “Always publish below a certain page.” and select the “News” page you 3. created
    3. Attributes to Display in Composer: News Thumbnail and News Description
    4. Click Save
    5. Under “Composer Content Order” you should now see the two custom attributes “News Thumbnail” and “News Description” as well as an entry for each composer-editable content block you created in step 4
    6. Optional: Re-arrange the order of the “Composer Content Order” by dragging the entries around.
    7. Click Save
  8. Test the creation of new “News” pages. Go to “Dashboard → Composer → Write”, fill out all the fields that you created and click on “Publish page”.

5. Display the news in the “news list” page

What good are our newly created news if we can’t display them in a nice list with their thumbnail and the formatted news description? However, this is the most difficult part as you’ll have to create a new block template and even write/modify some PHP code.

  1. Visit the “news list” page you created earlier.
  2. Enable “Edit” mode
  3. Add a block of type “Page List” to your page
  4. Chose the configuration options that you want but make sure that you select the following:
    1. pages of type “News” (this is the page type that we created)
    2. Location in Website: beneath this page
    3. Pages should appear: with the most recent first
  5. You should now be able to see a list of news pages you created. However, the thumbnail and the formatted short description are missing. Additionally, you might not like the format of that list. We now have to create a new block template to customise and stylise our news list.
  6. Create a new “page list” block template by uploading a corresponding PHP (I called mine news_index_thumbnail.php) file to /blocks/page_list/templates
  7. Click on the page list block and chose “Custom Template”
  8. Select the template you just uploaded from the list
  9. Leave “Edit” mode and publish your changes.

The creation of the template PHP file is by far the most difficult step. However, you can have a look at the template files provided in /concrete/blocks/page_list/templates and start from there.

For the thumbnail to work, we have to extract the image from the custom attribute “news_thumbnail” that we created and display it in the list. The following PHP code will take care of that:

<?php
  $newsThumbnailAttribute = $cobj->getAttribute('news_thumbnail');
  if (is_object($newsThumbnailAttribute)) {
    $imgHelper->outputThumbnail($newsThumbnailAttribute, 120, 120, $title);
  }
?>

For the formatted short description to work, we have to extract the formatted text from the custom attribute “news_descriptionl” that we created and display it in the list. The following PHP code will take care of that:

<?php  
  $newsDescription = $cobj->getAttribute('news_description');
  if (!empty($newsDescription)) {
    echo $newsDescription;
  }
?>

How-To Tags

page types, page type, articles, Composer, news, custom attribute

Related How-Tos

None.

  • Documentation
  • How-Tos
  • Developers
  • Create a News system using Composer

Do you have questions

  • What are users saying?
  • Who is using concrete5?
  • What makes concrete5 easy?
  • Why develop on concrete5?
 

We’re on “The Twitter”

So, just finished the #concrete5 beginner's guide (2nd ed) by @ortic. Actually learned a few things! Review coming tomorrow.

Follow concrete5

About

  • For Developers
  • For Agencies
  • For Designers
  • For Anyone
  • Testimonials
  • Showcase
  • Our Philosophy
  • Blog
  • Instant Setup

Community

  • Members
  • Forums
  • Chat
  • International
  • Jobs
  • eNewsletters

Developers

  • Download concrete5
  • Join Beta Team
  • Translate concrete5
  • Bug Tracker
  • Beta
  • Submit to Marketplace
  • Code Submissions
  • News
  • Community Leaders
  • User Doc Group
  • Related Projects

Marketplace

  • Add-Ons
  • Themes
  • Hosting
  • Training
  • Add-on Installation
  • Deal Of The Day
  • Swag

Documentation

  • Getting Started
  • Editor's Guide
  • Learn concrete5
  • Developers Index
  • How-Tos

Legal

  • Privacy Policy
  • Terms of Use
  • Refund Policy
  • Contact Us
© 2008 to 2013 Concrete CMS Inc. All Rights Reserved.

Sign In?

You must have a user account and be signed to perform this action.

  • Sign In
  • Register