23
Concrete 5 for the Beginner A journey to using Concrete 5 and the revelations of an Itinerant Web Designer Version 1.0 April 16, 2009 Author: Bill Carone Beginners Guide to Concrete 5 1

Concrete5 Beginners Guide

Embed Size (px)

Citation preview

Page 1: Concrete5 Beginners Guide

Concrete 5 for the BeginnerA journey to using Concrete 5 and the revelations of an Itinerant

Web Designer

Version 1.0April 16, 2009Author: Bill Carone

Beginners Guide to Concrete 5 1

Page 2: Concrete5 Beginners Guide

Document License

Copyright © 2009, Bill Carone at CarolinaGeek.com

I have licensed this document under the CC Attributions 3.0 license.

You can use this as you see fit. It is an unofficial document for Concrete 5 and is intended for beginners. This is not for those that are developers. I have tried to ensure that it is easy enough for users with little to no technical experience and designed so they may get to know Concrete 5 in small steps. If there are topics not included in this document and you would like to have them added to this documnet, please email me at [email protected]. I have used the forums to base much the information in this document along with my experience(s) in installing and customizing the cms.

Concrete 5 LicenseFor those of you interested in how Concrete 5 is licensed, it is stated here as reference.

The MIT License

Copyright (c) 2008, Concrete CMS, inc.

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sub-license, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Beginners Guide to Concrete 5 2

Page 3: Concrete5 Beginners Guide

Chapter OneBeginning with Concrete 5

This is the place for you. First, thanks for giving Concrete 5 some attention. I believe those at Concrete 5 have created the best content management system on the market today.

Now saying that, there are some things you need to know before you get dirty. Just follow the below links and I believe that your installation and learning of Concrete 5 will be relatively painless.

If you don't see a function or capability that you think you will need, search the forums and the marketplace.

Where to Start

So you decided to give Concrete 5 a drive around.

You can download the code from sourcegorge.net here.

Unpack the compressed file to a local directory. Refer to Figure 1 for what a typical directory structure looks like.

Figure 1 – Directory Structure

Once this has been done, open your FTP client and upload the source code to where you want to have it located on your web server. It can also be installed on your local machine provided the correct software is located on your local machine and/or your web host provider.

Here are the instructions from the "read-me" file in the uncompressed package:

Beginners Guide to Concrete 5 3

Page 4: Concrete5 Beginners Guide

"Installation Instructions for Concrete5

1. Make sure your config/ directory is writable by a web server. (Note, this is the config/ directory in the root of the archive).2. Make sure files/ and its subdirectories are writable by the Apache process (or the world.)3. Create a new MySQL database and a MySQL user account with the following privileges on that database: INSERT, SELECT, UPDATE, DELETE, CREATE, DROP, ALTER4. Visit your Concrete5 site in your web browser. You should see a gray installation screen where you can specify your site's name, your base URL, and your database settings.5. Concrete 5 should be installed.”

You'll probably want to change your admin users password (which can be done in the dashboard). Also check out the settings page in the dashboard."

Server Configuration and Installation

Once you have the source code, you should make sure that you have certain things available on your server or local host.

This list here is the basic things you need to get Concrete 5 installed:

• Apache web server• MySQL (version 4.1 or higher)• PHP (version 5 or higher)

If there is anything else required, the installation pages will tell you what you need. As an example, your php.ini file may not be set properly. That is what happened when I first installed it. This happens when you are on a shared server and certain things are needed by Concrete5. A search on the forums will normally get you the information you need.

For those of you using "Windows Servers", your setup may be a bit more involved especially if your using an IIS web server. Chunksmurray sent this into the documentation forum for Windows installations.

He writes

“Hi everyone. I recently went through the process of installing Concrete5 on Windows Server 2003 (Standard) using Apache/MySql/PHP. I didn't use a WAMP product, each element was installed individually. These are the steps I took highlighting any special changes that I needed to make. I'm not sure if this is information is needed, but here it is anyway. Admin peeps- feel free to remove it or edit it!

The biggest problem with this method is that everyone's server is different. This may not work for everyone, but it may help out with some issues you come across.

Installation on Windows Server 2003 with Apache

Beginners Guide to Concrete 5 4

Page 5: Concrete5 Beginners Guide

Please note that security of the installation should be considered before you complete any install. The individual products have great documentation, make sure you check it out.

Assumptions

I'm going to assume if you are tackling a Windows Server install you have a decent knowledge of the operating system. Some experience in configuring Apache, PHP and MySql would be beneficial but not mandatory. A lot of great tutorials exist on the web for installing these products. If you get stuck, check out Google.

Alternatives

Using a WAMP stack like XAMPP is an alternative for beginners or development environments. There is a great how-to in the Help section to install Concrete5 on a WAMP stack: http://www.concrete5.org/index.php?cID=6552

If this all seems like too much, you can have Concrete5 hosted. Check out this link for more information: http://www.getconcrete5.com/

Steps

1. Install Apache - Make sure to consult the documentation for info on security and performance. I changed root for easier access, but not a critical step. Ensure IIS is not running, otherwise install will fail.

1a. Confirm that in httpd.conf all your server specific information, document locations etc are correct.

1b. Make sure mod_rewrite is enabled in you httpd.conf

*Note: As there are a wide range of options available in Apache conf file, you will need to confirm these for your individual situation. i.e if you will be using Virtual Hosts, you will need to setup the vhosts file and make sure permissions are correct.

The Apache documentation has great information on all the options available to you.

2. Install PHP - there are some great tutorials around the web for getting PHP working under windows. If in doubt consult the excellent documentation at php.net

2a. As a minimum you need to enable the following extensions in php.ini:- php_gd2.dll, - php_mbstring.dll- php_mysql.dll

Again, you may need to enable more depending on your situation. This are just what I found to be minimal requirements.

2b. In php.ini, enter your email details under the [mail function] section. This will depend on your host.

Beginners Guide to Concrete 5 5

Page 6: Concrete5 Beginners Guide

2c. At this point you will need to make sure Apache can access your PHP installation and all modules and extensions are loaded. By using a phpinfo file you can confirm this.

3. Install MySQL - setup depending on your situation. Again too much detail for here, consult the documentation at mysql.org for more information.

3a. I ended up turning off 'Strict Mode' to allow the indexing job to complete. This can be done at the install or after.

3b. You can choose to donwload/install the MySQL GUI tools for administering your database. This can be done from the command line if you wish.

4. At this point reboot to make sure all services are functioning. Check for any errors.

4. Download and Unzip Concrete5 install to your htdocs directory.

5. You will need to create a database, a user and make sure to note down the password. You will need to give the user the following rights to the database: INSERT, SELECT, UPDATE, INDEX, DELETE, CREATE, DROP, ALTER

6. Open a web browser and enter the address of your installation. You should see a screen asking for your new web site details. Make sure to check all requirements have been fulfilled.

7. Once installation is complete you are ready to start building!

*Note: Depending on your environment, you may experience some errors. If you do make sure to note it and check the forums as their is a wealth of information there.

OK well that is it for now. I hope it helps some of you out. Feel free to comment on this, I have probably messed something up along the way. Again this isn't a magic bullet! The steps may differ for you.”

Search the forums for other tips on Windows installations. “

If you are installing Concrete 5 on a Windows server and experience troubles search the forums. Many posts have described the problems and solutions.

After your installation is completeOnce your install is complete you will be visiting your new site and wondering what to do next.

Beginners Guide to Concrete 5 6

Page 7: Concrete5 Beginners Guide

The very FIRST thing you need to do is to sign into the "Dashboard". To do that you will scroll to the bottom of the page and select the link there that says “Sign in to edit this site”. You will be logged in and will have a screen that looks sort of like this (Figure 2). It will also have the default Plain Yogurt Template installed. That information is in the figure below.

Figure 2 – Top Dashboard Menu

This is where your adventures with Concrete 5 begin. Just like the “Edit Page” says, you click that button and edit your pages. I will get to those left hand buttons below. Your third button from the right is important. Click it and you will come to the main “Dashboard” (Figure 3) as referred to in the following graphic,

Figure 3 – The Main Dashboard

Get familiar with this area. Some areas will be used by the site administrator but most of the time, you will be using the "TOP" Dashboard menu (Figure 2). This allows you to create new pages and to edit existing data "IN-LINE". That is the one thing that really makes Concrete 5 stand out from other cms's. It is implemented so wonderfully.

This is also the time where you should become familiar with Concrete 5 terminology (see the Glossary at the end of this document). It is a little different and some people will sound somewhat exasperated when you are asking a question that has been asked over and over again. This is OK, don't get riled up. Also, as a side note, not everyone has English as their first language, so keep that in the front of your mind when reading some of the forums. On the "Help" portion of the official site, you will find How-Too's, FAQ's and assorted other documents (including Screen Casts (the C5 team loves those)).

Beginners Guide to Concrete 5 7

Page 8: Concrete5 Beginners Guide

Chapter TwoLearning to edit your content.

IntroductionDisclaimer on site design: This section is for new people to Concrete 5. It is intended to describe introductory web site design and editing. The descriptions are based on my own experience dealing with people when approaching a first time web design meeting. It is “Basic”. The comments here do not in any form relate to how the Concrete 5 developers approach design. These are my own observations.

In this chapter you will learn the basics of editing your content. Your web site is loaded the first time with example data and this is very easily changed.

If you point your browser to your site (either localhost or your domain name), it will come up like any normal appearing Concrete based web site. Look around it. See if the basic menu system is right for you. Look to see how the color and text look.

This, my friends, is “Site Designing” at its base level. If you have ever been in business and had the oppurtunity to sit in with the first meeting of a web site design team, you will recognize some of the things I am about to say. Here are some questions that are asked for every web site that is designed (These are only a few. There are many many questions asked and answered before most sites are even demonstrated):

• What is your color schema going to be?

• Do you have a company or organization logo that will be used?

• Will there be a new branding of your company/organization done?

• Will the web site design determine your new branding?

• Will you want typical Web 2.0 formatting?

• Will you want a gallery?

• Will you want a forum?

• How many contributers will be adding or modifying information on this web site?

• How many people will be allowed in the administrative portion of this site?

The list can go on and on.

Colors and Logo'sOne of the worst things you can do is have lots and lots of color on your web site. This detracts more than it helps. Even for a funky forum or wiki, that has no formal reason to be on-line except for a way to communicate with like minded people. A lot of colors will be detracting. Decide on no more than 3 colors for your pages.

Beginners Guide to Concrete 5 8

Page 9: Concrete5 Beginners Guide

For your logo, unless its on a introductory page, make sure it is clear and easy to read, but small enough not to be a detractor. Make it pop by all means, but the logo is not the thing you want people to have blaring in their face. Reference the Concrete5 logo. Clean, sharp, not a lot of colors but it “POPS”.

Determine what your background's will be. Will it be a picture of some sort or just color? Limit your contrasts of color but remember to ensure that it is appealing to the eye. I know what your thinking, “But I am a funky, hip graphic artist that is hot with all the cool trends”. Still, it is recommended that you follow some type of design guidelines. You can make it appealing too all your visitors.

ImagesDo not crowd your pages with images. Normally on a professionally designed site you only have 3 maybe 4 images per page. And that is stretching it. Of course if this is a personal site, have all the images you want.

“But I want jammy stuff!” You want wiz bang rollover's and Flash movies and movies from You Tube or Vemio. You can have all that. But remember, if you just throw those things on your page, it may be confusing for your visitors.

Concrete5 has the tools pre-built to handle most of these needs. (Remember those terminologies I referenced earlier? Hopefully you took a look.) How will this be handled? You will use “Blocks” to make this happen. And you just need to supply the images. I will go into this in detail further in the Guide.

Editing ContentSo how will you edit your content? Start by logging onto the page of your site that you want to begin with. Remember Figure 2. Those buttons on the left I referenced. Click on the “Edit Page” button. You will see something like what is in Figure 4.

Figure 4 – A page in Concrete 5 that is in “EDIT” mode

Beginners Guide to Concrete 5 9

Page 10: Concrete5 Beginners Guide

The red boxes around the items on the pages are areas that you can edit. When you role over those blocks of text or a graphic, they will turn gray. When you see that, that will indicate an “Editable Area” and if you have the permissions to edit that content, you will be able too. Go ahead, click one. When you click your left mouse button, a small pop-up window will appear (See Figure 5).

Figure 5 – Edit Content Menu

When the menu pops up, select the “Edit” option. An installed program for editing content known as TinyMce will open on your page. It is a “What You See Is What You Get (WYSIWYG)” editor for changing information. It is free so don't worry about having to pay for it. The content of that gray area will be displayed. You can edit the data or add data just like your were in your favorite document editor. Go ahead, edit stuff. When you are done, look at the top menu of the Dashboard and tell it to Exit Edit Mode. A window will appear with some options. Concrete 5 has a versioning system built in. You can revert to any number of edits. So just look around this window and get familiar with it, you will see it every time you edit a page area. You can preview your changes, discard your changes or save it. This is where your save option buttons are and then select Publish My Edits (See Figure 6).

Figure 6 – Saving your data

If the content your editing or replacing happens to be a “Block”, the menu will be different and your options will be different. Play around with your pages to start learning the system.

As you can see in Figure 5, several options are there for the user to set certain items or do certain things for each page.

Learning about permissionsIf you are in a group of content contributers, you may only want certain contributers to edit certain pages. This is where the permissions option on your menu comes into play. With the help of your administrator or senior editor, create user groups from your dashboard. Then when you have your site

Beginners Guide to Concrete 5 10

Page 11: Concrete5 Beginners Guide

set up the way you want it, you can assign certain people to certain groups. Only a handful of people will have complete access to all content. This is a normal thing and if you are wondering, here is a typical breakdown of example group lists and users:

1. Administrative Users

2. Group Content Users

3. Content Users

An administrative user is typically one of the server administrators. Though in some cases, this may be split into a few sub-areas in which all technical things (special web page development or server maintenance) are done and then those administrators that handle the day to day administrative things. This could include management of groups, setting permissions for users, or moving data around the web site.

Groups are exactly that, groups of people that have access to select areas of content or administrative capabilities. Normally, with a site that only has between 5 to about 100 pages, you would only have maybe 3 or 4 groups. If you have multiple sub-domains, this is exponentially bigger. You may have topical areas of 100 topics or more. So you could potentially have upwards to 20+ groups just to edit content.

Content users then would be those contributers that are assigned to certain groups. The have certain permissions that allow them only to do certain things. You can assign people so that they cannot delete a page, they could be able to create new pages but not publish. So just like a newspaper, your authors may have to wait for the editors who then have to wait on the publisher to approve the content before it is available to the general public.

As you become more exposed to Concrete 5 and the way it handles data and the flexibility it gives a site owner, you will want to add/edit more and more.

Customizing PagesFigure 5 displays a menu item that is called “Move”. This allow a contributer to move data around the page in a “Drag and Drop” way. This gives considerable flexibility to contributers. So you may say to yourself, “I don't want my contributers to mess with areas such as side menu's and pictures.” That is easily restricted using the “Permissions” option of your menu. There you can select permissions for each editable area on your page. Even adding select groups.

When you are in edit mode and you have the reason to change a picture, Figure 7 displays your current options.

Figure 7 – Changing an image

Beginners Guide to Concrete 5 11

Page 12: Concrete5 Beginners Guide

Here you can replace your image by selecting the reset option. You select reset and then select Choose Image. It will take you to the File Manager area and you then select which image you would like to change. You select which image you want and then select update. Your page will have the updated image. You can also add a url to the image or create an image rollover here. Follow the options from the menu's it gives and when you are done select the update button.

Selecting a Custom TemplateIn the menu while in edit mode, you have an option of “Custom Template”. If there is additional things that are specific to a page or set of pages on an area of a site, you can select a “Custom Template” to accomplish this. There are no custom templates on a clean install for Concrete 5 but if functionality is needed, contact your administrator or web designer/developer to create these. You may even like to get the Developer/Designer Guide from Concrete 5 and design one yourself. It will take some time to learn how to do this but the effort is well worth it.

Adding information to editable pagesAs Figure 4 shows the areas outlined in red are editable areas, there is an option to add new data to a page. Move your mouse to the words “Add to Header/Main/Sidebar”, it will also highlight in gray. When you select this, a menu pops up asking you what type of information you would like to add to this area. The menu is a list of “Blocks” that are installed in your Dashboard. These are very flexible and gives the contributer many types of data to insert. Figure 8 shows you a partial list of items.

Figure 8 – Type of blocks to insert to pages

Normally, the Content Block or one of the image blocks are used by contributers. In our example I will select the Content Block. Select the Content block and TinyMce will launch just like when I edited content above. Here, you will add your text and your in-line graphics to add to your page. When your finished adding the content, click the save button. A video showing you how to do this is located here. The video tutorial and text below it also describes how you could add URL's to other pages inside Concrete and to external web sites and describes other default blocks installed with Concrete. It also shows you how you can add additional block types to your page.

Another great link for learning about adding content on your site (ie, surveys, auto-nav) is located here. The forums are great places to learn more details on editing Concrete 5.

Beginners Guide to Concrete 5 12

Page 13: Concrete5 Beginners Guide

Chapter 3Themes

IntroductionThemes are pre-built pages that give your site a custom look. Themes are the layout and graphics of your site. There are three themes that are available with a default install of Concrete 5. They are Plain Yogurt, Green Salad and Spatially Adjusted. Spatially Adjusted is not available for immediate use out of the box. You must install it under the Dashboard/Pages and Themes. Installing Spatially Adjusted will give you a simple example of installing an add-on Theme.

There are a lot of themes that you can get from the marketplace. Also, you can go to your favorite search engine and type in “concrete 5 themes” and find a lot of themes there. Just remember that these are often provided “As Is” and if there is a problem with it, you can email the creator or post on their forum to get more answers.

This is the definition of a theme per Concrete 5

“Themes are collections of Templates. Themes each get their own sub-directory in the /themes/ directory ….. and think of the Theme as a package of Templates.

That is not the complete definition but it should suffice for now.

Installing a Theme

There are a few steps you have to do when installing a new theme. You must have FTP privileges to upload the files.

• Download the theme you would like it have.• Uncompress the files using your compressions software like WinZip or ZipGenius and save to

your local machine where you will find it easily.• Log in to your server via FTP and upload your themes to site root/themes.• Log in to your Dashboard and go to Pages and Themes.• If the themes were uploaded correctly, you scroll down to see the thumbnails of the theme(s)

you placed in the Themes directory. There will be a set of buttons and you select the one that says install.

• The page will refresh and you will be given an option beside the new locations of your theme to “Activate”. Press this button and your site will then have that Theme as its default.

You should be aware that if there are any customized settings that have been done, they may be lost when activating a new theme. Go to the forums before you activate new themes.

Creating a new theme

Go to the “Help” section to learn how you can create your own themes. An alternative to the forums, just take a look at a theme you like. Review of the code will reveal that much of the code does not have to be modified. I have learned the easiest way (for me anyway) was to take a look at how the

Beginners Guide to Concrete 5 13

Page 14: Concrete5 Beginners Guide

page looks (looking at the code). For background images, you may only have to replace them and all the additional changes will be done in the CSS file for that theme. This makes creating your own theme fast and easy. The only time consuming thing for me when I created my first theme, was getting my background image(s) the right size and opacity. Otherwise, the second longest thing I had to do was to modify the CSS file to the color and font attributes that I wanted to use. It was that easy. You definitely can not create a custom theme in Droopal or Joomla this easily. It took me about 30 minutes the first time. Admittedly, I then spent several hours getting it just right (it was image sizes for multiple browsers and screen resolutions that had me stumped). The CSS files will take a little time, but if they are documented well, you shouldn't have an issue changing them. The cool thing about creating your own theme is that you can customize it anyway you want.

Beginners Guide to Concrete 5 14

Page 15: Concrete5 Beginners Guide

Glossary of TerminologiesYou can find this list in the Help Section of Concrete 5

(Reproduced here with permission)

The following are from the Site Owner section.

Dashboard Options

Dashboard: The admin panel. This is where you control everything behind the scenes. You are the puppet master.

Sitemap: The entire site at a glance. This is arranged in a Windows Explorer-like hierarchy – parent pages appear as folders, with children pages listed inside them. Click any page to open the sitemap options.

File Manager: Any file or image you’ve uploaded to the site will appear here. You can search for files based on the filename or the date you uploaded it. You can also upload files here.

Form Results: Any form you put on your site using the “Form” block type will output here. You can click on the form name and see the results below the list. You can also output these results to an Excel doc.

Users: All of the users registered on your site are listed here for your perusal and management. You can view and edit their user details, deactivate users so they are no longer able to log in, or add new users.

Groups: List of all user groups you have created. Groups are useful in situations where you want to limit permissions for an entire group of users – for example, if you wanted everyone in your human resources department to be able to edit your Careers page, but you don’t want them mucking around anywhere else, you could add them to a “Human Resources” group and give that entire group adequate permissions to edit that page.

Page Types: Lists the page types (templates), page attributes (fields you can set in the Page Properties pane), and single pages (one-of-a-kind page types you won't reuse elsewhere on the site) you have installed on your site.

Themes: These are the “flavors” available for use on each page of your site. Here you can activate, inspect, or remove the theme.

Add Functionality: A list of installed block types and packages, as well as block types and packages currently available for installation.

Site wide Settings: Gives you access to options that will affect the entire site. Here you can adjust site permissions, editing preferences, debug level, and maintenance mode.

Jobs: A list of automated jobs installed on your site.

Return to Website: This exits the dashboard and takes you back to your homepage. You remain logged in, so you’ll still see the Concrete5 menu and can still make edits.

Sign Out / Logout: You’re all done. This will sign you out of Concrete5 and take you back to your

Beginners Guide to Concrete 5 15

Page 16: Concrete5 Beginners Guide

homepage.

Concrete5 Menu OptionsEdit Page: Reloads the current page with new menu options and editable blocks outlined in red. You can mouse over these blocks and click them to access their edit menus.

Exit Edit Mode: Saves your changes as a new version. You can choose to add version comments to make notes of what changed in this version. From here, you can choose to publish your edits and make your changes public, or you can preview your edits and have the option to publish them at a later time.

Properties: All of the details of your page.

Page Name: This is the name of the page as it will be displayed in the auto-navigation blocks and the top of the browser window.

Page Alias: This is the vanity URL for the page you’re adding. It is automatically generated based on the page name, but you can change it if you like.

Date: The date the page was added. This defaults to the original date and time the page was added, but if you want to change the date yourself (to affect where it falls in chronologically-sorted auto navigation blocks, for instance), you can change it here.

Page Description (optional): A brief description of the page you are adding. This is also used as the short description search engines will display as your page summary.

Custom Fields: ?????

Meta Fields:Theme/Design: Choose the look and feel of your page. This is where you select from page types and designs that have been installed on your site.

Choose a Page Type: A page type is a basic “skeleton” of a page, with a set arrangement of blocks. Choose a pre-made page type for your page here. How to add new ones??

Choose a Design: The design of your page is the particular flavor for whatever page type you have selected. Choose one of the designs available for your site here. How to add new ones???

Versions: This is a list of all of the past and present versions of the page you’re viewing.

Add Page: Adds a sub-page directly under the page you are currently viewing.

Type of Page: Select the page type you are adding. These are managed in the Dashboard.

Standard Information:Page Name: This is the name of the page as it will be displayed in the auto-navigation blocks and the top of the browser window.

Page Alias: This is the vanity URL for the page you’re adding. It is automatically generated based on the page name, but you can change it if you like.

Date: The date the page was added. This defaults to the current date and time, but if you want to change the date yourself (to affect where it falls in chronologically-sorted auto navigation blocks, for instance), you can change it here.

Beginners Guide to Concrete 5 16

Page 17: Concrete5 Beginners Guide

Page Description (optional): A brief description of the page you are adding. This is also used as the short description search engines will display as your page summary.

Help: Hi, you’re here! Clicking Help anywhere on the site will take you to these friendly help docs. If you’re still stumped or just craving some personal attention, send us an email at [email protected].

Logout: This will log you out of Concrete5 and take you back to your home page.

The following is from the “Site Builders” section of the “Help” area of Concrete 5

Concrete5's documentation and comments refer to a number of internal conventions that, when learned, should make concrete5 more accessible to developers and end users alike.

At a summary level: Every Page has editable Areas, defined by its Page Type. Areas contain instances of Blocks (defined by Block Types) which may be anything from editable HTML to a highly customized survey. Each Page has its own Permissions and a Theme associated with it. Themes contain Template files that determine presentation for a given Page Type.

Common Terms

PagesA page in concrete5 is just like a page on any website: it typically fills the full browser, and be found at a unique URL. Pages in concrete5 can have pretty URLs or standard CMS-y URLs. For example, the following URL maps to the same article on concretecms.com:

http://www.concretecms.com/services/widget-development/first-look-opensocial/

http://www.concretecms.com/index.php?cID=140

Every page has a unique cID ("c" stands for Collection -see below:) and a bunch of metadata about it in the Pages table.

There are some exceptions to this Page=Collection rule, some standard pages like login and register are called "Single Pages" and exist in their own directory in a concrete5 install. They are still skinned through the CMS, see the bottom of this page for more explanation of the exceptions.

AreasAreas in concrete5 are parts of a particular page that can be edited using the content management system. Without any areas, a page would be completely static. Areas can have permissions applied to them, making it so that only certain kinds of blocks may be added to them, or they can only be viewed by certain people.

BlocksBlocks are bits of content added to particular areas on pages. A block is an instance of a certain type of content, as displayed on a page. When in edit mode, blocks may be hovered over with a mouse, clicked on, and edited within the page itself. All blocks have certain bits of data in common, like the ID of the

Beginners Guide to Concrete 5 17

Page 18: Concrete5 Beginners Guide

user who added them, or the date the block was created and modified.

Block TypesA block is the instance of content or functionality after it's been added to a page. The type of block determines how those blocks differ.

Types of blocks include:

• Some HTML content • An in-page image gallery • A navigation list • A list of popular pages on a site • A survey or poll

All of these are types of blocks. When a block type is installed, an administrator is able to add that type to an area on a page. When adding a survey to a page, for example, the survey is a block type, and the actual survey added to the page, with its customized questions, answers and results page is the actual block itself.

Blocks are typically self-contained, and blissfully ignorant of other items on a particular page. Every type of block has its own presentation layer, a form that gets called when it's being added, and a form that's called when it's edited. These forms are typically displayed in in-page popups dispatched by Concrete's interface layer. Developers interested in writing their own block types should check out the [[.:developers:developing blocks|blocks section of the developers manual.]]

Page TypesLike block types, concrete5 also has the concept of "page types." A page type is a template and convention allowing different types of pages to be added in different areas of a website. Page Types are typically named and considered around functional requirements, rather than layout requirements. For example, here is a list of page types that might be found in a corporate website:

• Home - A page type corresponding to the main home page of the site • Landing - A page type corresponding to one of the main sections of the site • Detail - A detail article page type • Press Release • News Article • Product

Page Types are typically made only for reusable pages (home is the one notable exception to this rule.) Single, one-off pages are described in "single pages" below.

ThemesThemes are the outer graphical skin of a concrete5 website. Separate from page types and single pages, themes allow the same types of pages to appear differently in different areas of a website. For example, an article within the sports section of a newspaper's website could have a completely different theme than an article page in the finance section. For more information about themes, see [[theme intro|

Beginners Guide to Concrete 5 18

Page 19: Concrete5 Beginners Guide

Introduction: Understanding Pages, Page Types and Themes]]. ==== Permissions ==== Disscuss what we have now.

Page & User AttributesWhile all pages and users have data that's associated with them, Concrete allows site administrators to create their own bits of data and associate these with pages and user accounts. These are known throughout Concrete as "attributes." Example of page attributes might be:

• "Exclude From Nav?" (check box) • "Meta Keywords" (text field) • "Additional Description" (text box)

Examples of user attributes:

• "Gender" (radio button w/Male and Female available) • "State/Province" (select menu)

UsersUsers are accounts used to edit a concrete5-enabled site. At its core, a user record in concrete5 consists solely of an ID, a unique username, and an email address. Extended user attributes can be added in the dashboard.

GroupsGroups are simply a way of combining users into a particularly semantic...well...//groups!// Groups are used primarily in concrete5 permissions: a given group of users can be allowed read, edit, delete, and administrative access to pages, areas and even individual blocks.

Developer TerminologyInteresting in developing for concrete5? You probably ought to understand the following concepts, in addition to those above:

CollectionsIn versions of Concrete before concrete5, Collections mapped entirely to Pages (see above.) Collections were so-named because they were "collections" of blocks. However, in concrete5, a collection can exist without a record in the Pages table, and thereby group blocks together without having any presentational aspect to it, or appearing in the sitemap. Furthermore, these collections can be called programatically, which can be helpful for programmers who want to use the power and flexibility of built-in blocks programmatically, without having to worry about where a page lives, its permissions, etc...

Single PagesSingle pages are Page records that don't have a page type. Instead, they're one-off pages that map

Beginners Guide to Concrete 5 19

Page 20: Concrete5 Beginners Guide

directly to a file in the file system. These are nice because they can be added directly to the file system, and, once installed in the dashboard, exist at http://www.yoursite.com/pagename/. Generally it's a nicer practice to use single pages where you know a particular page will only be needed once. Examples of single pages automatically created by the system include:

• Login • Register • Various dashboard pages.

Single pages use Concrete's Model-View-Controller, which makes them useful when using concrete5 as an application platform.

The default installation of Concrete in setup in the following manner. (The root directory in these examples corresponds to the root of your Concrete5 website. These examples also assume you are running one website, and not sharing the Concrete5 core amongst several sites.)

Client Application ContentsThese are directories directly within your web root.

/blocks

This directory contains block types used throughout your Concrete5 site. This will typically be empty on an initial installation - core block types are installed inside the concrete directory.

/concrete

This is the Concrete Application directory. Concrete5 owns these files - they should typically be off limits in most projects. For more information about what's inside this directory, skip down to Concrete5 Internal Contents

/config

This directory contains “site.php,” the configuration file added by the Concrete5 installation program. This stores your database connection settings and some server-specific information. Additionally, this directory contains “site_theme_paths.php,” which allows a developer to manually specify certain themes for certain areas of a site. Click here for more information about site_theme_paths.php

/controllers

The controllers directory contains controllers for any single pages, views or dashboard modules used by your website. Click here for more information about controllers and Concrete5's MVC syntax.

/elements

The elements directory is a place for you to keep snippets of PHP code reused throughout your site.

Beginners Guide to Concrete 5 20

Page 21: Concrete5 Beginners Guide

Examples of this might include a header menu or a reused sidebar. Elements are presentational in nature; if you have special functions or libraries you want to reuse for your website, these should go in ”/libraries” or ”/helpers.”

/files

The files directory holds all files added by your user's through the CMS. Additionally, the files directory may hold cache information or logs.

/helpers

The helpers directory store reusable functions based on the type of assistance they provide. You can include your own helpers in your helpers/ directory, as well as use helpers that come with Concrete5. A complete list of Concrete5 helpers is available here.

/libraries

The difference between helpers and libraries is largely a semantic one. Helpers are typically smaller in scope, and assist in one specific purpose, while libraries serve an underlying purpose. For example, Concrete5 ships with a “feed” helper. This feed helper exposes a couple of methods for the parsing of RSS and ATOM feeds; it is the public accessors to this functionality. However, the feed helper itself is really just a simple gateway to the very nice SimplePie library, which itself is contained in “concrete5/libraries/3rdparty/simplepie.php.”

/mail

The mail directory contains mail templates that your site uses, in conjunction with the Mail Helper.

/models

Items in the models directory correspond to database-backed items in your custom Concrete5 application. For example, if you added a “properties” table to your database, you'd need a PHP class for querying this information. In Concrete5, you'd add “property.php” to your models directory. Models are mostly optional, but if your model extends the Model class (loaded by the Concrete5 core), you'll be able to use ADODB Active Record syntax to query it.

/single_pages

Single pages - one-off pages like /login, /register, etc… - live in here. They inherit the active theme, and can have their view templates overridden by templates in a given theme directory. Single pages are most useful when paired with Concrete's MVC syntax.

/themes

Directories corresponding to your site's theme live here. Concrete5 ships with a default theme, but you can add your own theme to this directory and activate it in the dashboard.

Beginners Guide to Concrete 5 21

Page 22: Concrete5 Beginners Guide

/tools

Tools is a catch-all directory for other PHP scripts that you might need to integrate with Concrete5. These scripts are wrapped in Concrete5, and have access to the database and everything else, but aren't wrapped in Concrete5 permissions, have no MVC support, etc…Concrete5 Internal Contents

These are the items inside the ”/concrete” directory, typically off limits to all but the most wizened or foolish developers.

/config

Concrete's internal configuration directory, and it contains the main installation database file, as well as some constants that rarely change.

/css

This contains presentational style sheets used by the content management system, including its menus, dialog boxes, the dashboard and rich text editor.

/dispatcher.php

The main runtime of the program, dispatcher.php is responsible for parsing every request to Concrete5.

/flash

This contains flash assets used by the CMS, including a flash uploader, image thumbnailer, etc…

/helpers

This directory contains Concrete5's core helpers. Application helpers should go into their webroot.

/images

This directory contains images used by Concrete5's interface components.

/js

This directory contains JavaScript used by Concrete5's core components. Concrete5 makes extensive use of the Jquery library, as well as a number of custom JavaScript components.

/libraries

The core libraries directory contains libraries used Concrete5. These include some relating to Concrete5's MVC syntax, as well as some third party libraries used by various components of the system.

Beginners Guide to Concrete 5 22

Page 23: Concrete5 Beginners Guide

/models

Most of Concrete5's internal CMS components keep their data access classes within the models directory.

/packages

The packages directory contains directories corresponding to various “packages” available to the system. These are so named because they can be deployed to all Concrete5 websites on a given server (if those websites all share the same core libraries.) Individual sites can also make use of packages as well, by copying them into the packages directory and installing them. Packages can include single pages, blocks, elements, dashboard modules, controllers, mail templates and themes. At this time, the only package available is the core package, which is responsible for setting up the default Concrete5 theme, its login/registration process, the dashboard, and the block types which ship with the system.

/startup

Items within the startup directory are subroutines included during a page load by dispatcher.php

/tools

The items within the tools directory are interface components used by the content management system. These include popup windows, etc…

Beginners Guide to Concrete 5 23