Access the CMS through the top menu: CMS → Pages. Here you will find a list of all the pages that can be edited in the CMS.

1. Click on the button to create a new page.
2. Click on any of the pages in the list to open and edit it.

Once you click on the button or click on a page in the list the page will be opened for editing.

1. Button	Action
   	Close the current page and go back to the list of pages
   	Delete the current page
   	Save the current page and go back to the list of pages
   	Save the current page but do not close it
   	Preview the current page

2. The tabs on the left hand side controls various aspects of the page:
   General Information contains general information like title and status options.
   Contents holds the actual content for the page.
   Custom Design allows you to make layout updates manually to the page.
   Meta Data holds the meta data for the page.
   JavaScript allows you to load and execute custom javascript code on the current page.
   CSS allows you to make changes to the stylesheet on the current page.
3. The main area is where you edit the page information and content.

In addition to the main controls the Content tab also has three tabs: Left Column, Middle Column and Right Column. These tabs represent the three columns on the page in your webshop.

Click on the button above the CMS page list (CMS → Pages). Your new page will now be created, and opened for editing.

The first thing you need to do is give the new page a title and set the page status. All new pages are disabled (not published) by default, which means your new page will not be displayed in your webshop until you change the page status to Enabled.

You may also specify a URL for this page manually (if the URL field is left empty a URL will be automatically generated for you). The URL must be unique, meaning that two pages cannot share the same URL.

If you have several store views, you will also be given the option to choose in which store views this page should be displayed.

With the page open, click on the Contents tab to display the contents of this page. The contents of a page is divided into three columns: Left, Middle and Right. Each of the three columns represents a corresponding column on the page in your webshop.

The Left and Right columns can be turned on or off by changing the "Active" status on each of the columns. The main column cannot be inactivated.

Each of the columns are constructed as a set of blocks. At the bottom of the page you will find the button and a drop-down list which you will be using to add new blocks to your page.

There are several types of blocks divided into four different groups:

You can preview the page you are editing by clicking on the button at any time. You do not have to save the page to preview it.

1.4.1 Text & Media block

A Text & Media block is a WYSIWYG (What You See Is What You Get) container which you can fill with text, links, images, video clips and more.

As of MageParts CMS 2.0 the standard Magento WYSIWYG is used (included in Magento 1.4 and above).

1.4.2 Data blocks

Data blocks are basically dynamic collections of data, like the 10 most popular products or products in a specific category. Each data block may have block-specific configuration options like the number of products to be displayed, how they should be displayed and so on. Data blocks can only be added in the Middle column.

For the Products in Category data block to work you need a category ID. To find the ID of the category you want to use, navigate to (don't forget to save your page first) Catalog → Manage Categories in the top menu, and click on the category you want to display. The ID of the category is now displayed next to the name of the category.

For information on how to create a custom data block see Chapter 3

1.4.3 Sidebar blocks

Sidebar blocks are information boxes which you can see on the left and right side of your webshop, like the shopping cart, compare products, popular tags and so on. Sidebar blocks can only be added in the Left and Right columns.

For information on how to create a custom sidebar block see Chapter 3

1.4.4 Static blocks

Static blocks are meant to hold information that does not change dynamically, like a set of links in the footer. You can add any block you create under Static Blocks CMS → Static Blocks in the top menu.

On each of the blocks you add there are three buttons that allows you to change the position and delete the block.

Button	Action
	Move block upwards (if possible)
	Move block downwards (if possible)
	Delete block

With the page open, click on the Metadata tab to display the metadata for this page. Metadata (meta data, or sometimes metainformation) is "data about data", which in this case means information about your page. This information is used by search engines like Google and Yahoo to index your page and present information about it. The chances of someone finding your page through a search engine depends on the quality of the Metadata. For more information on how to write good metadata we recommend a search on Google on the subject.

1. A list of keywords separated by a comma that describes the contents of the page
2. A description of the contents on the page

With the page open, click on the JavScript tab. This view has two containers:
Custom JavaScript Code: Allows insertion of arbitrary JavaScript code into a page. The code will not be added directly to the source of the page, but saved to a file that will then be loaded. Do not include <script>-tags in the code.
External JavaScript Files: Allows loading of external JavaScript files. Each file should be entered on a separate line as a URL to the file . <script>-tags will be added automatically.

1. Custom JavaScript Code will be saved to a file which is then loaded into the page. Do not include <script>-tags.
2. External JavaScript Files (one per line). <script>-tags will be added automatically.

With the page open, click on the CSS tab. This view has two containers:
Custom CSS Code: Allows insertion of arbitrary CSS code into a page. The code will not be added directly to the source of the page, but saved to a file that will then be loaded. Do not include <style>-tags in the code.
External CSS Files: Allows loading of external CSS files. Each file should be entered on a separate line as a URL to the file . <link>-tags will be added automatically.

1. Custom CSS Code will be saved to a file which is then loaded into the page. Do not include <style>-tags.
2. External CSS Files (one per line). <link>-tags will be added automatically.

With the page open, click on the Custom Design tab. This view allows you to take precise control over the layout on the page using XML layout updates. For more information on how to use XML layout updates, please see Intro to Layouts on magentocommerce.com.

The CMS configuration is accessible from the top menu System → Configuration on the tab MageParts → CMS.

1. Navigate to System → Configuration in the top menu.
2. Click on CMS in the MageParts section of the left menu.

The XML Layout Update field removes blocks that already exists on a Magento webshop, allowing the CMS to take care of them instead. The default configuration removes the predefined blocks that comes out of the box on a Magento installation. If you have added any custom blocks that you wish to remove you can do so here.

Setting Sortable to No disables sorting of the blocks on pages in the CMS. Setting it to Yes enables sorting of the blocks on pages in the CMS.

These configuration options affect the WYSIWYG area on Text & Media blocks:

Option	Description
Width	The width of the WYSIWYG area in pixels
Height	The height of the WYSIWYG area in pixels

These configuration options affects the preview window:

Option	Description
Width	The width of the preview window in pixels
Height	The height of the preview window in pixels

From the Magento folder, navigate to app/code/community/MageParts/CmsGui/Model/Page/. Copy the file Middle.php.

Next navigate to app/code/local/. Create the following directory structure in this directory:

• MageParts
  • CmsGui
    • Model
      • Page

Paste the file Middle.php inside the Page directory you just created. Open the file and locate the getDataBlockTypes function. The first entry in the array represents the Popular products data block. There are no parameter requirements, which may seem weird at first, but looking at the code you will see the following parameters (amongst others): template, display_mode and type. These parameters will create the following XML string after they have been compiled: {{template="VALUE" type="VALUE" display_mode="VALUE"}} VALUE will be replaced by the value inserted by the user. The parameters are defined by a list of available properties.

From the Magento folder, navigate to app/code/community/MageParts/CmsGui/Model/Page/. Copy the file Sidebar.php.

Next navigate to app/code/local/. Create the following directory structure in this directory:

• MageParts
  • CmsGui
    • Model
      • Page

Paste the file Sidebar.php inside the Page directory you just created. Open the file and locate the getBlockTypes function. The first entry in the array represents the Newsletter sidebar block. The principles when adding custom sidebar blocks are the same as for the data blocks. The big difference between the two is that static blocks has no properties which can be defined by CMS users. So they are a little bit easier to manage.