Absolute Beginners Guide to Mobipot CMS Content Management

Welcome to Mobipot CMS, a Content Management System (CMS) platform. This guide will help you master the basics to make a very attractive and useful basic website in very little time and with no special technical skills. If you're stuck or require assistance please do not hesitate to contact support@genesissix.com.

---

• What is Mobipot CMS?

• Mobipot CMS is a Content Management System for publishing websites on the world wide web. It is a user friendly system that allows you to edit text and images, upload files, insert links, add new pages and generally manage the content of your website. Mobipot CMS offers a way for non-technically minded users to keep their website's up to date without having to learn any technical skills.

• Topics we will cover

• How to login to your admin Control Panel? Understanding Articles and Categories How to Create and Delete a Category. How to Create, Manage and Edit an Article. Introduction to your Article Editor

  Adding an Image to an article Upload and Manage images via Media Manager Inserting a Link into an Article Inserting a Table into an Article Adding a Menu Item which points to an Article

• How to login to your admin Control Panel?

• Enter the Control Panel by entering the information shown on the screenshot below. A specific email address will be assigned to you for login purposes. Please check with Mobipot's technical assistant should you require confirmation.

  

• Understanding Articles and Categories

• Categories in Mobipot CMS provides an optional method for organizing your articles. Here's how it works. A Category contains one or more Sub categories, and each Category or Sub Category can have articles assigned to it. One Article can only be in one Sub Category or Category.

  An Article is some written information that you want to display on your site. It normally contains some text and can contain pictures and other types of content. For many Mobipot CMS sites, articles form the majority of the information presented in the website.

• How to Create and Delete a Category.

• Create a Category

  Enter the Control Panel and hover your mouse on the Content tab. A dropdown menu will appear. Click on the Category Manager.

  

  This is where your Categories will appear. You can choose to create, publish, unpublish and delete any categories.

  A default category titled Uncategorised have been automatically created by Mobipot's System. All new categories will be filed under Uncategorised.

  To create a new category, click on the + icon highlighted in blue below.

  

  Give your category a title. We will name this Your New Category

  You can add a Description for your category. Or leave it empty.

  When finish, click on the Save button highlighted in blue below.

  

  A blue highlight box will indicate that the category has been successfully created.

  Notice that the category is located below Uncategorised. This indicates that the new category is a sub category to the one on top.

  

  Delete a Category

  To delete a category, Click on the Checkbox of your category. All checkboxes are located on the left side of each item.

  Once you have checked your item, Click on the Remove icon on the top right of the panel.

  

• How to Create, Manage and Edit an Article.

• Enter the Control Panel and hover your mouse on the Content tab. A dropdown menu will appear. Click on the Article Manager.

  

  Creating an Article

  This is where your created articles will appear. You can choose to create, publish, unpublish and delete any articles.

  To create an article, click on the + icon highlighted in blue below.

  

  Give your article a title. It also becomes the default file name for the article.

  When finish, click on the Save button highlighted in blue below.

  

  Note: Copying and pasting text from a word processor like Microsoft Word, iWork or Open Office Writer into the Mobipot editor will transfer alot of formatting and unnecessary code. To remove all formatting, paste your text using the Paste as plain text icon .

   

  Main Information

  Above the text editor are a number of features and advanced options for your article. Here you assign things like categories, publish or unpublish article, etc.. We highlight the main ones you would be using by adding a screenshot image of that feature.

  Tags - assign tags to your Post. Tags are another form of categorization of your posts. Separate them by comma's. Or you can use the Choose from the most used tags option.
  Categories - attach your post to a Category. If you neglect to assign the post to a category, it will be assigned to the default category titled Uncategorised. To Create a Category, click here
  State - choose to publish or unpublish your article. Unpublishing an article will not remove it from the system.

   

  Article Options

  This is an advance feature and will be covered in our advance manual. You likely won't need it.

• Introduction to your Article Editor

• When writing an article, in the text editor you simply type your text. The basic paragraph formatting will create itself as you hit the enter key at the end of each paragraph.

  For most of these icons you would select/highlight (click and drag with your mouse) the block of text you wish to apply it to then click the icon to apply the formatting. Other tools like inserting images and tables requires that you just click on the area of the content you wish to place the image/table then click the icon and enter the information in the pop-up box. (Learn how to insert image by clicking here.) It is like using a word processor.

  Below we summarize each Icon according to the order they appear on the editor:

  	New - clears all content in the article
  	Preview - allows you to view article before saving
  	Align Left - aligns text to the left
  	Align Center - centers text
  	Align Right - aligns text to the right
  	Cut - cut selected text
  	Copy - copy selected text
  	Paste - paste copied text
  	Paste as Plain Text - paste text copied from another source so as to strip all formatting from the copied source
  	Remove Formatting - remove formatting for a selection of text that you may have cut and pasted from another source or word processor
  	Spell Check - spell checks your text.
  	Undo - undo your last change
  	Redo - redo your last undo
  	Find - find and pinpoint keywords that you have inserted in your article
  	Replace - replace keywords that you have inserted in your article
  	Select All - select all content in the editor
  	Insert Image - insert image files such as jpg, png, gif.
  	Insert Table - insert a table by entering the number of rows and columns in the pop-up box
  	Insert Horizontal Line - insert a horizontal line similar to a divider
  	Insert Special Character - adding special characters not available on your keyboard. Things like this ¥, £, ©, Æ, or é.
  	Bold - select an area of text and click the bold icon
  	Italic - select a block of text and click the italic icon
  	Strike Through - Adds a line over your text through your text
  	Numbered List - auto insert numbers to your list
  	Unordered List - creates bullet to your lists
  	Increase Indent - indent a section of text to create block quotes
  	Decrease Indent - decrease indent
  	Block quote - Insert "quote marks" by selecting a block of text and clicking the icon
  	Add Hyperlink - select the area of text you wish to be the link and click the link icon. Add the link URL, choose if you want it to open in a new window or the same window. Then give the link a Title to describe what its linking to.
  	Remove Hyperlink - select the area of text you wish to be the UN-link and click the un-link icon.

  	Source - click on the icon to hand code your text. This will disable the auto-format. For users with knowledge of HTML tags
  	Styles - Use this drop down to select pre-styled formats for texts.
  	Formatting - Use this drop down to select pre-styled formats for headers.

• Adding an Image to an article

• Firstly, place your cursor and click on the spot in the editor where you would like the image to appear.

  Next, click on the Image icon highlighted in blue below. A pop-up box will appear.

  

  Ignore the fields for now. The width and height for your image will be automatically updated once you have located your image. For now Click on Browse Server to locate/upload your image.

   

   

   

  Here is where your image/media files will be stored. For now it is empty as you have not uploaded any files. Click on Upload to upload your image. Search for your image file on your computer and hit the Open button.

  

  A successfully uploaded image will appear in the pop-up as shown below. Double-click on your image.

  

  Now you can fill in the fields.

  Give the image a title in the Alternative Text field.

  If the image is too big, you can Resize it by changing the Width to your preferred measurement. The Lock Ratio will ensure that your image is resize proportionately.

  If you would like to assign a specific width and height to your image, click on the Lock Ratio to unlock the proportionate-ratio-resizing and enter your preferred Width and Height in the fields provided.

  Note: Changing the Width and Height of your image in the fields provided will not effect the size of your original image that is located in Mobipot's server.

  

  If you would like to link your image (usually used to link your image to a bigger image or other urls), click on the Link tab highlighted below.

  

  Link your image with another image using the same method as shown earlier when you Click on Browse Server.

  You can choose to have your link appear in the same browser, or in a separate tab. Click on the Target field and select your choice from the dropdown.

  For external links, enter the url in URL field.

  Click OK when DONE

  Note: You can only assign 1 action to your link. That is to link your image to EITHER another image or a URL and NOT both.

• Upload and Manage Images via Media Manager

• You can choose to store all your images in Mobipot's server before creating an article. It will be kept in the Media Manager till needed.

  To do this, hover your mouse on the Content tab. A dropdown menu will appear. Click on the Media Manager.

  

  The Media Manager looks exactly like the pop-up box that we had encountered in our previous post.

  Let's Create a Folder for our images. Right-click on the images folder as shown below. A dropdown option appear. Select New Subfolder.

  

  A pop-up box will appear. Enter a title for your Subfolder. Then click OK
  Your New Subfolder will appear on the left panel below the images folder. Click on the New Subfolder to view the folder. A selected folder will be highlighted in blue. It is currently empty. We will upload images into this folder.

   

  Click on the Upload button as shown in the screenshot below.

  

  Search for your image file on your computer and hit the Open button.

  The upload progress is indicated on the right-hand corner of the frame. Your browser will be automatically refreshed upon successful upload and your image will appear in the folder.

  

  To Delete an image, Hover your mouse over the image you would like to delete and Right-Click your mouse.

  A drop-down option will appear. Select Delete to permanently remove the image from Mobipot's server.

  

• Inserting a Link into an Article

• To insert a Link into an article, click on the area of the content you wish to place the link. Then Click on the Link icon in the editor. A pop-up box will appear.

  1. Enter your URL in the field as shown above.	2. Choose how you would like to display your link; in a separate window or in the same browser.

  Click OK when DONE

• Inserting a Table into an Article

• To insert a Table into an article, click on the area of the content you wish to place the table. Then Click on the Table icon in the editor. A pop-up box will appear.

  Enter the number of Rows and Columns you would like to appear in your table. The default table Width is set as 500px. You can determine your preferred width. If you leave this field blank, the table will shrink and expand according to your content. You can enter the Height measurement, but we advice you not to as it restricts the table from expanding and your content might flow out of the table and break your template. Add a Caption to your table. This will be the Title of your Table The Advance Table options will not be covered in this manual. You likely won't need it. Click OK when DONE

• Adding a Menu Item which points to an Article

• Now that you have created an article, it is time to link it. You will notice that your article does not appear anywhere in your website.

  Hover your mouse on the Menus tab. A dropdown menu will appear. Click on the Add New Menu Item.

  

  This will take you to the Menu Manager

  Menu Manager: New Menu Item

  

  Enter your Article Title in the Title Field. In this case, we'll name this Your Brand New Article.

  You can choose to publish your article in any menu by choosing the selections available in the Menu Location. You might have more than 1 set of menu in the future. By default, it will be set to Main Menu.

  The Parent Item will be set to Menu Item Root.

  In Link Type click on the arrow to view the dropdown options. Click on Article. You'll notice that other options will appear, especially on the right.

  

  All created articles will be listed in the Article fields. To view, Click on the arrow. Only Your Brand New Article is available now. In future when you create more articles, it will be made available in the dropdown. For now, Click on Your Brand New Article.

  Menu Manager: Article Options

  On the right panel are a number of options for your article. You can choose to use (Yes) or disable (No) the option by clicking the arrow on the side of all fields to enable the dropdown. All options are set to Use Global by default. We highlight the main ones you would be using by adding a screenshot image of that option.

  Show Title - Show the title/header of your Article. Normally set to Yes. Set to No when you use an image as your article title instead of text. An image is used for the title when it involves a lot of graphic that cannot be manipulated via CSS.
  Show Category - Show the main parent if the article is in a sub-category
  Show Author - Displays the article creator's name below the header of article.
  Show Create Date - Displays the date the article was created below the header of article.
  Show Modify Date - Displays the date the article was modified.
  Show Publish Date - Displays the date the article was published.
  Show Print Icon - Displays print icon on the top right corner of the article. Enables printing of article.
  Show Email Icon - Displays email icon on the top right corner of the article. Enables visitors to email article to others.
  Show Hits - Displays the number of times the article has been read.
  Allow Comment - Enable comment box for visitors to leave comments on the article.

   

  Below is a screenshot of an article with the enabled options.