Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
ContentBox is a CMS built by developers, for our own use. We obviously try and cater to the usual CMS functionality features, but being developers, we tried to throw a couple of extra goodies into ContentBox.
In this section we'll give you a few tips about the different editors available and some of the features common to all of the editors.
Blogging capabilities are essential component for any web site and web application. Blog entries help provide more context around products, services. It inherently creates more on-line presence and, if managed properly, better search engines results.
ContentBox comes with a built-in blog which you can turn ON and OFF from System > Settings. The default setting is ON.
The main Blog page in your ContentBox Administrator shows a table with all your blog posts. We have 3 useful indicators.
Shows if your post has been published
Shows the numbers of views
Shows the number of comments
And you also have quick actions:
Where you can check the info related to each individual post
And entry actions
Developers are getting more and more familiar with Markdown, and it's actually preferred by a lot of developers when it comes to writing documentation and blog posts, and that is why we give you native support of Markdown in the ContentBox editor. We also threw in a few other features when adding support, some might just save you hours of work.
We have included a new code editor that supports HTML and Markdown natively. This will allow developers or editors to write in native markup and have all the integrations into ContentBox.
The new editor also sports real time previews and side-by-side editing in full screen. Your editing experience is about to get a whole lot better now.
Running a website, on top of your normal job duties can be a lot of work. Time is valuable, and important when trying to plan your content and the corresponding social media publication. This is the reason why we created an important ( but often overlooked ) feature, Publication and Expiration dates for content. You might be surprised what in ContentBox is date controlled.
This is most useful when scheduling blog posts. Blog posts can take a long time to write, and post, and with busy schedules this might not get done. This is why at Ortus Solutions, we try to write our blog posts, and schedule them ahead of time. When editing a blog post, in the right hand side 'sidebar', you will see these options at the top of the sidebar.
You can set the publish date / time, and the post will go live at the right time for you.
Expiration dates are useful too, but not a normal use case for blog posts… but these scheduling options are not just available for blog posts. Expiration dates work great for webinars or other events, where a sign up page should be removed after event sign ups close, or maybe a special or promotion that should only who while it's active. This will even show and hide menu items in your navigation.
Lets look at the Page Details version of the Publishing options
As you can see, they are exactly the same. This makes it familiar and easy to work with. This is also the case for Content Store items… which gives you even more options in regards to scheduling content.
ContentStore items can be included inside of pages and blog posts too, which means you can include a time based piece of content into your homepage, to show upcoming events, or show a link to a sign up page for event, and then hide the link when the registration period is over.
This is a nice feature, which at the surface looks simple but useful, but with this feature working with ContentStore items as well, the options are endless.
As you can imagine, there are a lot of widgets you can use in ContentBox. Most widgets have specific and larger functionality… sometimes you might want something quick and simple… like outputting a single variable. You can output any RC or PRC variable with a simple helper function.
RC - Request Collection
PRC - Private Request Collection
The underlying framework (ColdBox) will merge the incoming URL/FORM/REMOTE variables into a single structure called the request collection structure that will live inside the request context object. We also internally create a second collection called the private request collection that is useful to store data and objects that have no outside effect.
The code below allows you to easily output from any of these source:
${rc:name}
This will output the name variable from the RC scope.
This means you can output URL variables in your content. Look at this example, with the following url
mydomain.com/?name=Gavin Pickin
You could access the name with ${rc:name}
You can tap into more items in the RC and PRC scopes as well, but you have to remember, you cannot output a struct to the page, only strings.
This gives you some nice options for form submissions, searches, and ways to add more information to a normal pages if you write your own modules.
If you actually want to use the text above, without trying to output a variable, you can escape the code.
<escape>${rc:name}</escape>
If you do not escape the variables, and the variable doesn't exist, you'll see an error message like this:
Error translating setting on target prc:page.renderContent(): The variable: page.renderContent() is undefined in the request collection (private=true) Keys Found: META,currentLayout,CBENTRYPOINT,currentRoutedURL,layoutmodule,currentView,CBROOT,layoutoverride,CBWIDGETROOT,CBSETTINGS,COMMENTSCOUNT,CATEGORIES,cbox_incomingContextHash,currentRoute,CBADMINENTRYPOINT,COMMENTS,PAGEOVERRIDE,OCURRENTAUTHOR,CBTHEME,CBTHEMEROOT,currentViewArgs,PAGE,viewModule Error translating setting on target rc:lastname: The variable: lastname is undefined in the request collection (private=false) Keys Found: namespaceRouting,event,pageSlug,format,namespace
Any setting stored in ContentBox can be output using the following markup: ${setting_name}. This is a great way to create site-wide static settings that can be output in any editor.
We have introduced local storage auto saving capabilities for all editors in ContentBox. No matter the implementation, we will provide auto-save capabilities. This is a great way to know that silently your work is secure. I don't know how many times I select all and type by mistake. This feature has saved my bacon, and now you know about it, it could save you too. Editor
With any Bulletin Board Forum, or CMS, they each have their own syntax for special markup. You can now use the <escape></escape> syntax in any content editor to escape ContentBox translations for settings, markdown, etc.
All live previews are now responsive. Meaning you can choose from the responsive previewer the type of device and get immediate feedback of the content result in real-time.
The content editors have completely been re-designed for mobile first paradigm. They sport new tabbed interfaces for history, comments, custom fields and editing. You also have much more real estate when editing and even full screen editing support… including auto shrinking the left side bar, with an option to shrink the right sidebar too.
Contentbox has many options for creating and managing content, which are accessible through the ContentBox Administrator:
Blog entries
Categories
Content Store Items
Media Manager
Menu Manager
Sitemap ( Pages )
In the following chapters you'll find an quick overview of each one of these options.
The Media manager is a WEB UI to be able to interact with your Media. You can access the Media Manager from the Admin Menu under Content, in addition to buttons within different Content Editors.
The Media Manager has many options, but by default will look like the image below.
Refresh Listing - Refreshes the current folder location
Go Home - Return to the Home ( Root ) directory of the current library
Create Folder - Create a new folder in the current location
Rename - Rename the currently selected File or Folder
Delete - Delete the currently selected File or Folder
Upload - Brings up the Upload form, to allow you to select a file to upload. Remember, Media Manager also allows HTML5 styled uploading, so you can drag file(s) into the media manager to upload them. Folder Uploading is not supported in this version, but will be added in an upcoming update.
Download - Download the currently selected file.
Quick View - Preview the currently selected image in a modal window. Only supports Images.
File Listing - This shows the current folder in File Listing / Details view. This is the default listing style, shown in the screenshot above.
Grid Listing - This shows the current folder in Grid Listing / Thumbnails view. This is a great way to preview directories of images. This view can seen in the screenshot below.
Context Menus ( otherwise known as right click menus ) are available for Files and Folders. Files have the following context menu items
Folders have the following context menu items
The Status Bar has useful quick view information.
Full file path breadcrumbs
Filename, File Size, and last modified date-time stamp.
Next to the Module Name - 'Media Manager' you will see Content in a yellow label. That is the current Library you are looking at. There are several Libraries available for you to choose. To switch library, click the drop down select labelled Switch Library in the top right like the image below.
Depending on your security settings, you will be able to directly browse, upload, rename and delete filtes from the Content, Modules, Updates and Widgets locations.
There are a lot of configurable options for the Media Manager, to fit in with your use cases. Media Manager Settings are found in the administrator under System > Settings > Media Manager
The relative path or ColdFusion mapping in your server that will be the expanded root of your media manager. The default is modules/contentbox/content. This is restricted to relative paths to ensure the user of the Media Manager cannot access content outside of the web root. If you would like to use a folder outside of the web root, please create a coldfusion mapping ( and web accessible mapping if required by the Media Provider ) to ensure the folder is relative to the web root.
Media providers are used to deliver your media files securely and with greater flexibility as you can place your entire media root outside of the webroot.
This provider uses the ColdFusion cfcontent tag to deliver and stream files securely to the user. This uses a ContentBox route __media, that translates the path into a cfcontent call and delivers the content.
This provider will forward to the real physical location in the server for the media path requested via the internal servlet page context, so no real media path URL will be shown to the user. Use only if the media root is web accessible and a relative web root path, so double check your media root.
This provider will relocate to the real physical location in the server for the media path requested. Use only if the media root is web accessible, so double check your media root.
If enabled, the media provider system will issue caching headers for all assets. You can use the cbcache=true URL param to issue no caching headers on any asset.
Default: true
File Browser options includes a series of user options ( Yes / No ):
Allow Creation
Allow Deletes
Allow Downloads
Allow Uploads
Size Limit - Maximum size of the file upload in mb - defaults to 100mb
Max Similtaneous Uploads - Number of uploads allowed at the same time - defaults to 25
When using the Quick View for images, images are shown in a modal window, with a maximum width defined by this setting.
ContentBox allows you to create and publish content directly from the Administrator. There are two main sections where you can do this
Blog | You can create and publish blog posts.
Sitemap | You can create and publish pages
Content categories can be edited in the administrator, located under the left hand menu 'Content'.
Each post ( Page or Blog ) can be filed under zero, one or many categories. Categorization helps group content and gives users more options for navigating your content.
Links to your categories of blog posts show up in the right hand menu of your blog layout (theme implementation may vary), and show up as 'Tags' for your blog entry.
The category manager is simple, including a simple search, listing Categories with their associated slug, and a list of pages and entries currently associated with this category, and options to 'Edit' or 'Delete'.
You can perform Bulk actions using the checkboxs next to Category Name, and clicking 'Bulk Action', which allows you to perform one of the following tasks:
Delete Selected
Import
Export All as JSON
Export All as XML
To add a new category, click the green button labeled 'Create Category' in the top right hand corner of the category manager. Clicking the 'Create Category' button pops a modal window up like below, asking for category name, and slug.
Category Name This is the name of the category, displayed wherever the category is used.
Slug The category slug is the unique id refereneced throughout the site, including the URL. If you leave the slug blank, the system will generate a slug for you, for example: If your category is called 'Recipes', the generated slug would be 'recipes' and the url would be http://www.yoursite.com/blog/recipes In some cases, you would prefer a slug different from the auto generated slug, for example: If you category is called 'Tasty Recipes', instead of 'tasty-recipes' for a slug, you could use 'recipes' or 'food' and the url would use the slug of your choice, so the url would be http://www.yoursite.com/blog/food
Save Category Once you have entered your category information, click 'Save Category' to save the category, and return to the Category list.
Cancel - Close Modal Clicking the X (close) or 'Cancel' button will cancel the creation of the new category.
To edit a category, click the name of the category from the category list, or click the green edit icon.
Update the category name, and slug as needed, and click 'Save Category' when you are happy with the changes. Closing or Canceling will revert your changes to the last saved version.
Note: The Category Slug is an important part of the url creation, so changing the slug will affect your existing links.
Deleting a category is a simple action, but can have a lot more impact that you might initially think. A category slug is used to create urls, and removing a category will render all those previous url links invalid. Deleting a category does not remove the content that belongs to that category, but does remove one of the ways to view that for your user.
You can delete a category, one at a time, using the red delete (trash can) icon button on the line of the category you wish to delete.
If you wish to delete multiple categories at once, you can select the check boxes next to the categories you wish to delete, and click the 'Bulk Actions' button, and select 'Delete Categories' from the drop down menu.
When you delete a category that has associated content, pages or entries, the category is deleted, and the association is deleted, but the original page / entry is not deleted.
For convenience, ContentBox has easy import and export options for your categories. To export all of your categories, simply click 'Bulk Actions' and select 'Export All as JSON' or 'Export All as XML'. Your browser will prompt you to download the Categories.json or Categories.xml, depending on the option you chose.
The JSON/XML includes just the 3 base fields, category, slug, and categoryID, as shown below in a json example.
The menu manager allows you to create 'Menus' to be used in a variety of ways in your ContentBox Website. A Menu can contains several Items, which can be from a range of Item types, Content like Pages and Blog posts, Media, Submenus, URLs, JS or Free type. Menus are easy to create, and give you a lot more options that relying on pages inside your traditional Sitemap structure.
By default, ContentBox sites use the Sitemap to generate a menu for display. To use a Menu instead of the Sitemap, you have to install a Theme which supports Menus, and then select the Menu you wish to use as you main site Menu.
Some Themes may support additional menus for top menus, footer menus, side bar menus. Please refer to your Theme.
Title: The name of the Menu
List Type: ( ul | ol ) Unordered List or Ordered List
Menu Slug: This is the code referenced slug, to be used to retrieve the Menu in the Theme or View, where required.
CSS Classes: Optional CSS Classes to be added to the Main Menu List itself ( ul or ol - when supported by the Theme )
List CSS Classes: Optional CSS Classes to be added to each of the List Items ( li - when supported by the Theme )
Content
Media
Submenu
URL
JS
Free
Each content type has it's own set of attributes.
Label - Read Only - Same as the Item Content field below.
Item Content - This is Name/Title that shows in the Menu Item itself.
CSS Classes - Optional additional CSS classes to be added to the list item
Content refers to a Page, or Blog Entry. You can search and select the content item you wish this item to link to. The Item Content ( visible label for the menu item ) automatically populates when you select an item for Content Item.
In Addition to the Common Attributes listed above, this type also includes:
Content - This is a search and selection tool to help you select a page or blog entry for this Menu Item to link to.
URL Classes - Additional CSS for this Menu Item's HTML Element
Target - Allows you to select how the link is treated by the browser, allowing
_self
_blank
_parent
_top
Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
Title - A accessible title, commonly used by browsers as a tool tip.
Refers to Media from the Media Manager
In Addition to the Common Attributes listed above, this type also includes:
Media - This is a search and selection tool to help you select a media item from the Media Manager for this Menu Item to link to.
URL Classes - Additional CSS for this Menu Item's HTML Element
Target - Allows you to select how the link is treated by the browser, allowing
_self
_blank
_parent
_top
Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
Title - A accessible title, commonly used by browsers as a tool tip.
A Submenu type allows you to select an entire Menu to be included in the current Menu, as a Menu Item.
In Addition to the Common Attributes listed above, this type also includes:
Select Sub-menu - This is a drop down select list of all of the Menus available for selection.
Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
Title - A accessible title, commonly used by browsers as a tool tip.
Note: This relies on the Theme you are using, to utilize this feature.
A URL allows you to add any linkable URL you might desire into your Menu.
In Addition to the Common Attributes listed above, this type also includes:
URL - The URL you wish to use for this menu item
URL Classes - Additional CSS for this Menu Item's HTML Element
Target - Allows you to select how the link is treated by the browser, allowing
_self
_blank
_parent
_top
Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
Title - A accessible title, commonly used by browsers as a tool tip.
Not all menu items will be Links to other HTTP resources, with todays applications, we are commonly using more and more JavaScript, and the Menu Manager allows you to add JavaScript into your Menu Items as well.
In Addition to the Common Attributes listed above, this type also includes:
JavaScript Code - JavaScript to be excuted when this Menu Item is clicked.
URL Classes - Additional CSS for this Menu Item's HTML Element
Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
Title - A accessible title, commonly used by browsers as a tool tip.
This is a menu item that creates a 'free-text' menu item. This item only uses the common attributes, Item Content, and CSS Classes... listed above.
As you add, edit, and delete Menu Items, you can preview those menu items in page. You can refresh the menu by clicking the refresh icon next to the title Preview if the preview has not updated as expected.
