Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Info
titleArchives

You are using phpFox version earlier than 4.6.0? Please refer instruction for this article here.

This will show you how to clone the default Bootstrap theme so you can make changes to it as any edits to the default Bootstrap theme will void your support and can cause site issues. We recommend purchasing custom themes from third party developers if you need something more than a basic theme or if you don't have HTML/CSS skills to change your theme how you want it.

...

 

Excerpt
Widget Connector
urlhttp://youtube.com/watch?v=hyAKmrv12-E
Excerpt Include
Enabling Short Urls
Enabling Short Urls
nopaneltrue

  • Click Themes

...

  • Image Added
  • Click Create New Theme on main menu the Actions of Themes page.
    Image Added
  • You'll see a popup to enter your new theme's details.
    1. Choose Material or Bootstrap or Blank theme to clone, depending on your needs.
    2. Enter a lower case alphabetical theme name.
    3. Submit when done.

...

    1. Image Added
  • Now, you will see the theme is added to your list of themes when in the Theme Manager. You would want to click Edit when on your theme and set it as default:
    • Click the lower left arrow to open the theme options:

...

 

Note
titleRemove the update notification on your cloned template

 

If you clone a template for editing and customization, you can see that whenever the original template is upgraded, the cloned template also gets the upgrade notification.
Image Added 

If you want to remove this update notification on cloned template, you can do as following:

1. Open file at:

.../PF.Site/flavors/name-of-cloned-template/theme.json

 2. Edit the code and remove a line then save the changes on the file:

Code Block
languagejs
{
    "id": "material",
    "name": "Material_cloned",
    "store_id": "2004",     //Remove this line
    "version": "4.6.1p2",
    "vars": {
        "body-bg": {
            "title": "Body Background",
            "id": "body",
            "attr": "background"
        },
......