Frameworx User Manual

FrameWorx User Manual

Introduction to FrameWorx

FrameWorx is a CMS framework that allows you to rapidly have us develop a website from the ground up using intuitive and re-usable content. To save customers time on data entry, we've created a system where chunks of content or information can be re-used on several areas - whether it be accross multiple pages, social media, or anywhere else in the system. These snippets of content are referred to as blurbs, which can be tagged for use for several occasions with blurb types, which all ultimately get output into your pages, navigation structure, and call to action areas.

Global Functions

When you log into your FrameWorx admin panel, you will first land on a page where you can add and edit blurbs, with a sidebar to navigate on the left hand side. On the top left, you can view and export your customers who are registered on your site, and just below it there are any custom admin interfaces that MyRamani has provided for you as a client. Below that is the master admin navigation bar, this is the area every customer using Frameworx sees and uses in their own custom website. The "search" bar on the top left allows you to search any section in the admin panel you're in for what you're looking for.


Blurbs are re-usable chunks of content or information that can be used in various scenarios accross your site. Each blurb has a regular, short and long version of itself. This is because the same term can be presented to the user in different ways based on factors such as the device they browse the website with, the current page they're viewing and how applicable it is on that page, and the amount of space you might have to show that information. For example, the term "contact us today" can also be spelled out as "click here to get a quick and free quote" or simply "contact us" as its short version. This allows the user to change the way text is presented in three different ways, from one area in the admin interface. This essentially eliminates the need to edit page's HTML code directly using a WYSIWYG editor as most other CMS platforms are setup, causing no stress with broken layouts, having to edit multiple pages that contain some similar information, or bloated source code from the editor itself .. making it fit your website's design perfectly. FrameWorx does also offer an editor for pages as well.

Each blurb also has a "type" that can be associated with it, some default types are setup which are discussed more in the Types section. This allows this piece of information to be used in several places. For example, in our navigation menu, we might want to display the short version, on our sidebar the long version, and the regular version as the heading of the contact us page.

Managing Blurbs

From your Frameworx admin panel, click "Your blurbs" in the left hand navigation pane to access all your blurbs. Some blurbs are pre-setup upon installation and can be edited here.

In the blurbs admin section, the first dropdown is your blurb types, setup under "your types" on the left (covered in the "Types" section). You can filter your blurbs by type using this dropdown.

You can add a new blurb in the very first row of a blurb entry. Note that all fields when editing blurb content are required. If you wish to edit an existing blurb, click on "Edit blurb content", or "Edit blurb types" to allocate it to specific types. A description of each field is listed below:

With blurbs, and almost any part of the admin panel, use the + sign to add a new item, the checkmark to save an item, and the "X" to delete an item. You can also use the "Save all" button on top to save all changes if you've modified multiple items.

Some blurb types have special meaning or significance, these are outlined more in the Types section. An example of such a type is "Navigation". Applying a blurb as a navigation label will by default use its short version in your website's navigation menu, and allow you to nest it within another navigation blurb as a subcategory.

Blurbs can be used in any of your pages, or any templates our developers create for you. Please see the pages section for more details on using blurbs within your content. Blurbs can also be viewed individually for SEO purposes. Blurbs can also contain other blurbs which are of type "website terms" to have nested parsing of blurbs.


Types are used when organized or tagging blurbs. Some types are defined by default with the framework installation, and should not be deleted. You can create your own types to tag blurbs into for various purposes depending on your website's needs. User defined types require a developer from MyRamani to make special exceptions or cases based on their types. Default types are pre-defined and used within our pre-defined templates.

Managing Types

The only thing you require for a type is the name of a type, think of this as an equivalent to a "Tag" for a blog post in Wordpress, or a keyword in other CMS platforms. Simply enter the name, and the checkbox to save.

The following is a list of pre-defined types that come out of the box with Frameworx and are used throughout the website in various ways:

  1. Logo: This is your website/company's logo. Many companies have different ways of representing their branding, which is where this blurb type comes in. There is and should only ever be one blurb of this type with three different choices of logos. You will first need to upload your logos from the Media Manager and then enter the image names in the blurb content areas. The regular/medium blurb is the name of the default logo you use, on your header for example. The short blurb is the blurb you'd use when sharing information to social media platforms or anything which requires a smaller sized version of your logo, and the long text which can either be the same as your default logo, or a longer version of your logo that can be used in other areas of the website or in your outgoing emails.
  2. Website Title: This is the name of your company/website which can also be represented in three different ways. Similar to the logo type, there is only ever one blurb allocated to this type. For example, our company chooses to represent its name in three different ways:

    You can set these three to the same term if you do not want there to be a difference anywhere on your website with your company name.
  3. Navigation: This blurb type is used for your navigation menu. Any blurbs tagged as type navigation will have their short version show up in the top navigation menu, and allow you to nest a dropdown style navigation tree for use in your website's header. The medium and long versions can show up in other areas of your website if you please with a designer's aid.
  4. Footer Navigation: This blurb type is used for your footer navigation menu. Any blurbs tagged as type footer navigation will have their medium version show up in the footer navigation.
  5. Website Terms: Website terms are common terms used throughout your website such as "contact us", "order now", "email address", "password" etc. You can modify the wording for any of these terms on the fly. Please note that adding additional website terms requires a web designer to display those terms in areas you want. All out of the box terms are displayed in our default templates.
  6. Content: Any blurbs labelled with type "Content" can be used inline within pages you create in Frameworx. If you wish to use a blurb or term as inline content within your pages, you can tag them as type "Content" for later use.
  7. Social: Any blurbs labelled with type "Social" can be used within a social media rotator for use with your online presence.

Website Settings

This section handles your global configuration of the website, consisting mainly of default information. It is divided into the subsections "website","social","home","email" and "customer". Each option in the admin panel has helper text next to it so that you can understand in English what it is you're changing. Details on some options are expanded below

  1. The "Website" section allows you to edit generic information about your website - the defaulted title, your slogan or catchphrase, what layout your pages should be, whether search engines should crawl your site and other options.
  2. The "Social" section allows you to enable or disable social connect, which allows your website to integrate directly with your social media outlets, and allows users to login or register to your website via Facebook connect, and whether you want to show sharing icons or a toolbar on your pages so that people can share them easily to their favourite social media outlets.

    You will need to obtain developer credentials for social media post management. The following links can be used as guidelines for Facebook and Twitter:
  3. The "Home" section allows you to edit how your home page should look. Besides pulling information from a page created for the home page, you can specify whether you would like a slideshow to appear on top, upload various slides for it, and choose whether you'd like a horizontally cropped image to appear on portrait mode mobile devices, and how big the cropped image on those devices should be in pixels.
  4. The "Email" section allows you to enter information about your email SMTP server so that our website can send emails on your behalf. You can obtain this information from the company you are hosting emails with currently. This section also allows you to enable newsletter subscription forms in your footer, and have people stay updated with your updates. You can also specify what fields are required fields that users must enter in the contact form when contacting you. This last field is usually reserved for developers, you simply need to let us know what fields you need as required fields
  5. The "Customer" section allows you to enable customer registration, and/or force registration in order to view the website


Pages are the content that the end user sees accessed by a link to your website. Pages consist of blurbs, static text, images, videos and any content you'd like. A detailed list of each field and what they are used for can be found below.

Social Links

In this section, you can enter all your social media links to follow your company on. You can also enter the image name from your Media Gallery as an image to use for this social media type. The position determines the order in which these links show up, in ascending order starting from 0.

Media Manager

In this section, you can upload images and animations required for use on your website in general. This allows you to easily use them in pages, slideshows, social links and several other places. To begin, simply click on "choose files" and select the images you want to upload from your hard drive by holding down the ctrl/command key and clicking on the images you wish to upload. You can also select all in a specific folder. Ensure that only image based media is uploaded otherwise you will get an error.

Once the files are uploaded, refresh the page or click "Media Manager" on the left again to see your uploaded images. You can now give each image a title (alt text), and a slug (SEO friendly name for the image). For example, if an image of a wedding cake named IMG_5543.jpg was uploaded, but you wanted links to that image to actually contain the name of what it is, you could make the slug of the image "wedding-cake" and the title of the image "Vanilla and Chocolate swirled wedding cake".


Slideshows allows you to easily embed a slideshow to the top of any of your pages with an easy shortcode (except the home page, which is configured under Website Settings).

Below is a list of each field in a slideshow, and how to set them up:

Once you save your slideshow and refresh the page, you will see thumbnail versions of your slideshow images if you entered them correctly below the images textbox for each slideshow.


This section allows you to add authors to your website, these authors are simply for informational purposes only and by default they cannot login to your admin panel until you allow them to be editors. An email address, and name are required fields for an author. You can also add an unlimited amount of extra information for an author, whether it be their address, their website, their position, or their full biography, you can accomplish this using authors. Authors appear on your pages with the author shortcode, or within templates that our development team creates for you.

Short Codes

Here's a list of shortcodes you can use in your pages and how they work: