Welcome ,

PageCarton Documentation

Interested in coding widgets, classes, or methods? Check out the Code section!

Auto Sync PageCarton Core from Another Git Repository

Share

article by Ayoola Falola in Advanced Topics , PageCarton Lessons

From PageCarton 1.8.71, it is now possible to sync one's PageCarton core with a third-party repository. In some cases, it is useful to want to connect PageCarton to one's own fork of the Pa...

From PageCarton 1.8.71, it is now possible to sync one's PageCarton core with a third-party repository. In some cases, it is useful to want to connect PageCarton to one's own fork of the PageCarton core from Github. You can do this in few easy steps:

  1. Get the direct link to the ZIP archive of the PageCarton core you would like to sync with. If you are using Github, your link should be like "https://github.com/pagecarton/pagecarton/archive/1.9.x.zip". For example, mine is "https://github.com/ayoolafalola/pagecarton/archive/1.9.x.zip" because that is the direct link to the ZIP file of the git branch I want to work with.
  2. Edit your "pagecarton.json" configuration file in the web root and update the "repository" option to the link to the ZIP archive. You can create your own "pagecarton.json" into the web root if you don't have one; a sample "pagecarton.json" file is located in "pagecartion/core/local_html/" directory, you can copy that to the web root to get started. When you are done, the configuration file in your web root should look like what is in the screenshot below

  3. Run the "Application_Backup_GetInstallation" widget by going to example.com/widgets/Application_Backup_GetInstallation?pc_recreate_installer=1 on your browser. Don't forget to change "example.com" to your own domain name or "localhost" if you are working offline. This is the manual way to sync your core with the set repository. You may need to log in if you are not logged in as an admin

  4. If you would like the server to sync the core immediately you push changes to Git, set up a web hook on your github account to always call example.com/widgets/Application_Backup_GetInstallation?pc_recreate_installer=1 whenever changes are pushed.


     
  5. If all is set, hook should be listed. You can make this call as many times as possible.

7 yrs ago

Different Installation Methods

Share

article by Ayoola Falola in Installation , Advanced Topics

There are three documented ways to install PageCarton 1. Offline Standalone Installer - http://docs.pagecarton.org/2017/10/10/installing-pagecarton.html. Default installation method. 2. Boots...

There are three documented ways to install PageCarton

1. Offline Standalone Installer - http://docs.pagecarton.org/2017/10/10/installing-pagecarton.html. Default installation method.

2. Bootstrap Installer - https://www.pagecarton.org/2018/03/17/php-auto-installer-script.html. To use this, the server must be able to connect to the internet to download the files.

3. Manual Installation - http://docs.pagecarton.org/2019/06/27/installing-pagecarton-core-custom-directory.html. Install PageCarton in a custom directory.

7 yrs ago

Installing PageCarton Core to a Custom Directory

Share

Documentation Article by Ayoola Falola in Installation , Advanced Topics , PageCarton Lessons

Overview Installing PageCarton by default has been made to be an easy process. Find the recommended installation instruction here "Installing PageCarton". First, this is to ensure...

Overview

Installing PageCarton by default has been made to be an easy process. Find the recommended installation instruction here "Installing PageCarton". First, this is to ensure the most secured options are set as preferred. It is best practice to ensure that system executable files are stored outside outside of the web root (e.g. htdocs, public_html, www, etc); so PageCarton by default installs all core files in a directory one step outside of the web root. It is recommended to always use the default installation settings unless you know what you are doing. It is however possible to choose a custom directory to install PageCarton in. More like, to change where PageCarton should look for files.

This is especially useful on servers where the webserver is not able to write into the directory outside the web root, in this case, you would have to install PageCarton into the web root itself. Meanwhile, this method can be used to make PageCarton core install to the web root. In this tutorial, that is exactly where we will be installing. Your own directory may be anywhere you choose, so far you have the right permissions set.

Download PageCarton Core

It is time to download the PageCarton Core files. The best place to get this is to download the ZIP archive from Github. This gets you all the core files without any other confusing files. You may also clone the git repository https://github.com/pagecarton/pagecarton to your computer.

Unpack the files and ensure you have a complete "core" directory that is inside the "pagecarton" directory. This is represented in the screenshot below.

Upload PageCarton Core to Server

Unzip the core files and transfer them to somewhere on the server. Note the directory where the "core" directory is located and copy them as follows:

  • Copy the whole "pagecarton" directory to wherever you would like it to be on the server. Just ensure you have all the correct permissions set so that the webserver user can read and write to the directory. In the example below, we will be installing directly inside the web root. See the screenshot below:
  • Copy all the contents of "local_html" directory to your web root. The "local_host" is located inside "core" directory.
  • Copy a file named "pc_installer.php" in "pagecarton/core/application/documents" directory to the web root, the same place where the contents of "local_html" was uploaded. This file needs to be there to make this look like a normal installation because without this, we may not be able to create the first admin user in during personalization.

Customize Configuration File

PageCarton could be hardly seen as a hard-coded system as most of the settings in it are configurable within the system itself. However, PageCarton has a configuration file which is only configurable in an external editor. The PageCarton configuration file is the JSON file that holds the hardcoded settings used in PageCarton. This is the only place where it is advisable to configure where the PageCarton is installed. The configuration file "pagecarton.json" is part of the files that was just copied from "local_html" directory to the web root. So look for "pagecarton.json" in the web root and open the file to edit its content.

Set the "PC_BASE" to the location of the directory where "core" is located. Do not use the "core" location directly, rather use the full path to the directory holding the "core" directory, which is "pagecarton" directory in most cases. Please note that this has to be a full path to the directory. Check the provided screenshots for example. Make sure the right permissions are set on the directory so that the web server can read and write to it.

Conclusion

PageCarton is now installed in a custom directory. You can check this by now trying to load your site from the browser. If you have any issues, try to start all over again or leave a comment on the forum so we can take a look. 

7 yrs ago

Creating A Website Back-Up

Share

Documentation Article by Olabamiji Mayowa in Getting Started

Creating A Website Back-Up within PageCarton Admin Panel Step One Log in to your website Admin Panel using your website name /pc-admin (www.example.com/pc-admin)   Step Two ...

Creating A Website Back-Up within PageCarton Admin Panel

Step One

Log in to your website Admin Panel using your website name /pc-admin (www.example.com/pc-admin)

 

Step Two

Click Setting Button after clicking on setting this will list out all the necessary button you can use to make changes to your website.

Click Back and Restore button Wait Patiently for next screen below  

 

Step three

This screen will show you three buttons.

Upload Back-Up Button: allows you to upload your website back-up from your computer System

Import Back-Up from another website Button: allows you to upload your website back-up from another website Domain

for instance if you design your website on server A and you want to move to Server B this button is very useful.

Create a Back Up Button: this button will lead you to another screen to create your first website Back-Up

 
 

 

 

 

 

 

 

 

 

 

Step Four

You can select which content you would like to create with your Back-Up. You can describe your back with few words (This is Optional).  When you are done Click Create Button and wait for the Next Screen to Come up..

 

 

Step Five

Congratulation your Back is created successfully (Click the X button to go back to your window)

 

 

Step Six

Now you have successfully create your first website back you can  now download your back-up on your computer for save keep..

 

Thank you for your time  feel free to comment or you have any question use the comment box..

7 yrs ago

How to increase PHP Upload Limit

Share

article by Ayoola Falola in Code , Troubleshooting , Advanced Topics , Working with PageCarton , PageCarton Lessons

Sometimes, one may need to upload a large file and if there is a limit in the PHP Configuration, you may not be able to use your PageCarton installation to upload large file. An example is if you w...

Sometimes, one may need to upload a large file and if there is a limit in the PHP Configuration, you may not be able to use your PageCarton installation to upload large file. An example is if you want to upload a large theme, you may need to tweak your server settings to make this possible.

By default, the maximum upload file size for PHP scripts is set to varying sizes. Sometimes it is set to as large as 128MB, sometimes, 2MB. However, you may want to change these limits. For example, you can set a lower limit to prevent users from uploading large files to your site. To do this, change the upload_max_filesize and post_max_size directives in your php.ini file.

In some cases, default server settings may not let you upload larger files via your website. To increaes file upload size in PHP, you need to modify the upload_max_filesize and post_max_size variable’s in your php.ini file. This tutorial shows how to increase PHP upload limit in PageCarton by locating the PHP.ini file and updating it accordingly.

  1. Login to your PageCarton Admin Panel. Usually a link like http://www.example.com/pc-admin should take you to the PageCarton Admin Panel if your website is powered by PageCarton. Don't forget to change www.example.com to your real domain name if you are coying and pasting.
  2. Navigate to Server Info and Configuration Page. The option should be under the System Settings in the PageCarton Admin Panel.

  3. On the pop-up screen, look for the section where it says "Loaded Configuration File", then chech the corresponding filename to the PHP.ini file being used for the PageCarton installation.

  4. Locate this file in your file explorer, the file path differs from installation to installation, in this example, we are using MAMP Server on Mac. Your installation or operating system may have this path pointing to a different location

  5. Open this file in a Code Editor. Any text editor could work fine but using a code editor like Notepad++ , or VSCode is recommended because of their advanced features. The mission is to change some configuration set in this file.

  6. Locate the part of the text document concerned and change to a preffered value. The following items should have values above the file sizes you want to upload. For example set to 200M to allow uploads up to 200M. For example update file to have the variables to reflect the following
    upload_max_filesize = 128M
    
    post_max_size = 128M
    memory_limit = 128M
    The concerned items are:
    1. upload_max_size
      Sets the max size total uploaded file can be
    2. post_max_size
      The variable post_max_size which is used to set the maximum size of POST data that PHP will accept. Setting a value of 0 disables the limit.
    3. memory_limit
      Sets the limit to the memory available to your application. This also can affect your upload limit
  7. When you are done updating this file to high values dependng on your case, save the file
  8. Restart PHP web service and Web Server. If you don't know how to do this, just reboot the server and start the server as usual.

By default, PHP file upload size is set to maximum 2MB file on most servers, but you can increase or decrease the maximum size of file upload using the PHP configuration file (php.ini), this file can be found in different locations on different OS distributions. Hope this has been resolved with this article.

7 yrs ago

Steps in Creating a Theme

Share

article by Ayoola Falola in Code , Advanced Topics , Design and Layout , Getting Started , PageCarton Lessons

The goal of creating a PageCarton theme is to help users of PageCarton create and customize their site and apps fast and easy. Creating a PageCarton theme is a very easy process but a lot of t...

The goal of creating a PageCarton theme is to help users of PageCarton create and customize their site and apps fast and easy. Creating a PageCarton theme is a very easy process but a lot of times, we should go an extra mile so that our users can even have more customization options.

Get a clean HTML-based template

Get your already-designed HTML-based template file ready. lt may be a template design of your own. A template in PageCarton is simply a ZIPed html files. You may as well get a clean HTML-based template (zip file) from w3layouts.com or similar sites. We have a list of other places you can get already designed HTML templates to start fast. Where to get Free HTML Templates to Build PageCarton Themes

https://youtu.be/HwR0FpfHJ5Q

Import the template into your PageCarton admin panel

You build the PageCarton theme from within a PageCarton Admin Panel. If you don't have your own copy of PageCarton installed, you may create a free account on PageCarton.com to begin to build themes ASAP.

https://youtu.be/pVMJa4Tarac

  1. Go to your PageCarton Admin Panel

  2. Click on 'Appearance' in the menu to the left

  3. Proceed to 'Themes'

  4. Click 'Upload new theme'

    • Enter a 'Theme name' of your chouse. The theme name should be the same name of the template if a template was downloaded from another source.

    • Upload your theme archive

    • Leave the 'Theme Update Options' as they are

    • Save to complete the process.

  5. Close the pop-up Screen

  6. The new theme should listed on the list of Themes.

  7. Under the new added theme, within the 'options' click on 'Preview' to confirm that all the components of the theme are displaying correctly. 

 

Integrate PageCarton Functions

PageCarton brings life into every HTML code by making it dynamic automagically. Contents will become easily manageable through different publishing methods in PageCarton. It only takes a few moments. Edit the theme to ensure people that want to build their websites and apps with it can do it effortlessly. That is the purpose of PageCarton Themes. Users of the theme should be able to use the basic tools to update the sites It is good to do all the updates in the 'Code View' of the HTML Text widgets. Basically, themes that will pass as Standard PageCarton Theme must:

  1. Be suitable for either of 'Blog', 'Corporate Site', 'E-commerce', 'Personal' categories of sites or any other categories listed on the PageCarton Themes Repository
  2. Be generic, so that if it is a blog theme, it could good for 'Fashion' blog and 'Politics'.
  3. All the theme contents must be editable using the 'Website Wizard' utility.

The standards are set to help us cater for our growing community of users at this point.

Update: We encourage that the new syntax be used to integrate PageCarton Functions instead of what is described below. Learn the new syntax here: HTML Syntax & API for Embedding Widgets - PageCarton Posts

Everything explained below is now obsolete. Visit the following link to continue building a theme HTML Syntax & API for Embedding Widgets - PageCarton Posts

....

Update Content

Follow the following steps to make this 

  1. On the list of themes and under the 'options' of the theme we are working on, click 'Edit Theme'

  2. On the popped up screen, click 'Edit Main Layout'

  3. When all is loaded, click on 'Widget Options', this should bring up a lot of options to add content

  4. Update the logo area to use the following HTML code

    <img style="max-height:100px;" src="/img/logo.png" alt="Organization Name">

    https://youtu.be/tXnBqz_M5-4

  5. Make all the forms work by embeding the in-built widgets using details on Linking HTML forms to PageCarton Forms. The following forms usually come with themes: 

    • Contact Forms

    • Email Opt-in Form

    • Sign in Form

    • Sign Up Form

    • Search Form

  6. Use the repleaceble static texts as defined in Standard Replaceable Texts to use in Building Themes. Replace all dummy text contents with these replaceable texts. 

    https://youtu.be/uw9JcqKE7b8
     

  7. If there are items like posts on the theme, embed all the posts so they can be automated using "Application_Article_ShowAll" widget. Watch this videos to understand more. Use only standard post types so that when users change themes, they don't need to add new content. Check out Standard Post Types Parameters in Embedding Widgets for the required parameters for specific post types. The following are other important parameters

    https://youtu.be/hRyzd_1edoI

    • 'add_a_new_post' - set to the number of post you want displayed by default e.g. 3. This will ensure there is a dummy post shown whenever the user have not added any content

    • length_of_description - limit the character lenght of the 'article_description' variable

    • length_of_title - limit the character length of the article_title variable.

  8. All dummy navigation links are to be removed.
  9. All navigation links and options not suitable for the category of themes should be removed and replaced with 'Ayoola_Menu' widget embedded.
  10. Other widgets to be embedded in the theme layout to build up dynamic contents themes are

    • Application_SiteInfo - to retrieve/access the site headline and description and the banner image from the database

    • Ayoola_Menu - to display navigation options

    • Ayoola_Page_Info - to retrieve/access current page headline and description from the database

  11. If the theme has a "Post Viewer" - a template of the page used to view a single article/post, '/single' page. Duplicate it as "/post-viewer"  to use it to view all posts or "/post-viewer-article" page to set it to view a specific post type. E.g. create '/post-viewer-article' to make a page a theme page to view post of article types. Embed the "Application_Article_View" widget on the page so it could retrieve the post data and display it on the page. The videos above will help understand how.

  12. Create the "/default-layout" page in theme pages. Since the theme can't possibly include all the site pages, the default layout is the layout to be used for the all system pages that is not included in the theme. That is the page that will be used to create/edit new pages when this theme is set as default. To create a "/default-layout" page, you would need to duplicate an existing theme page and name the duplicate "/default-layout".

Colors 

To futher allow users to personalize their sites it is important to provide flexibility in colors and theming of the pages. PageCarton users have been able to set prefered font colors and background colors for a long time, we could make use of this in our theme design. Beginners who are importing an existing templates should try as much as possible not to tamper with the template designs and colors. The following are the color guidelines:

  • Determine which color is the theme color. Usually, template designers have hard-coded this colors into their CSS files. 
  • Identify where the colors are used - the CSS classes, selectors, etc which are referenced.
  • Introduce inline CSS to overide the hardcoded declarations using the pagecarton color variables. This is an example of how to do this:
    • Insert a HTML widget at the top the 'Main Theme Layout'
    • Switch to Code View
    • Insert a codes similar to this below:
      <style>
      .bg-primary, .testimony-section .owl-dots .owl-dot.active, .gallery .icon, .ftco-footer .subscribe-form .form-group .submit:hover
      {
          background-color:  !important;
          color:   !important;
      }
      
      .btn.btn-primary 
      {
          background: ;
          border-color: ;
          color: ;
      }
      .btn.btn-primary:hover 
      {
          border-color: ;
          color: ;
      }
      .ftco-navbar-light .container, .bg-darken, .blog-entry .meta-date, .ftco-footer .subscribe-form .form-group .submit
      {
          background: #000 !important;
      }
      </style>

       

    • Click on advanced settings icon on the top right of the widget and embed any widget e.g. 'Application_Global'

    • Save the 'Main Theme Layout'. 

    • Go to Page Settings to set a background color and the font color and see if it displays when you preview the theme.

  • Try to limit the colors in the design to just the two colors, the defined background color and the font color.

  • And do not create new color elements, just change the colors to match those defined by the users through the variables '' and ''

 

Before Design After Design


 

Other things to do

 

  1. Test the theme by setting it as default and make sure all the pages are working.
  2. Export the theme
  3. Upload the theme to http://themes.pagecarton.org
  4. Share the theme info and link on social media
  5. Read more topics on Theme
  6. Watch videos on Building Themes for PageCarton
7 yrs ago
← Previous Next →