System : Themes

How to customize your website's Theme, logo, images, and colors

Andrew avatar
Written by Andrew
Updated over a week ago

The flexible nature of the Dating Pro script makes it easy to change the Theme of the website.

Edit your site’s colors schemes, fonts, images and logos in the administration control panel under Services > Customize your service > System > Themes.

Installed themes stand for the themes that you can activate. One of them is already active.

Available themes need to be installed first before they can be activated.

If you would like to create a custom theme though, some programming knowledge will be required, and you will need to access site files via FTP or with File Manager.

This is how it works. To create a new theme, open your site files and go to /application/views. You will find /flatty and /gentelella directories that contain templates, CSS files and other files that constitute a design theme:

  • gentelella’ stands for the administration panel,

  • flatty’ stands for the user interface.

Copy a selected directory (with its contents) and give it a new name. Here, I copied a directory for the user interface:

PG Dating Pro: Modify the design of your dating site

Within the new directory, open file theme.php and edit the following lines:

$_theme[“gid”] = “theme_new”; //give your theme a new ID
$_theme[“type”] = “user”;
$_theme[“name”] = “New theme for user mode”; //a new name
$_theme[“description”] = “New theme 2022”; //a new description

The theme will appear under ‘Available themes’ in the administration panel.

Click ‘Install’ to activate this theme and edit it.

After that, you are free to edit the theme files:

PG Dating Pro: Modify the design of your dating site

or proceed with editing themes directly from the administration panel.

Theme editor

Editing a theme – Logotype editor

Go to Interface > Themes > Installed themes > select the theme that you want to edit logotype for > click on Edit logo.

You are able to change the background image and logotype on the index page by clicking Edit logo.

You will get to the Logo editor:

Upload desktop and mobile background image according to the recommended sizes.

Now you can upload two types of logos:

  • Logo image is used on the index page

  • Small logo is used for all the other site pages

Make sure to save the changes.

Note: To edit the logo and the background image on the main page, please view this detailed manual How do I modify the main page of my dating site?

Editing a theme – Color schemes editor

Go to Interface > Themes > Installed themes > select theme > click Edit colours:

You can also edit color schemes of your website.

The color schemes that you see in the list are: Default, Honey, Arundiana, Luisia, Listera, Dendrobium and Bonatea.

Click ‘Edit colours’ for the selected scheme, and you will be able to edit the colors and fonts:

Color generator will help you create matching colors.

Fonts editor also present in Interface section of the admin panel.
You can customize site notifications according to the site's color scheme.

Visit Dating Pro Marketplace to add more functionality and to choose unique design for your website.

Did this answer your question?