Create your brand

Customization guide

Take a look at our themes, you may find the right color variation for your project and save some time. To set up and brand your job board website following CHECKLIST is recommended.

1. Change website logo and social media links

Change logo and social media links in the admin area. Social media links in the footer will not be shown if you leave the fields empty. Next upload and replace the fav-icons (fav.png [square], fav-ios.png [square], fav-startup.png [320×480]) in the public folder. Make sure the fav icons have the same name, so they will get properly replaced.

Logo change

2. Set the homepage

In Look & Feel Settings you can choose which page will be served first to the visitors. Display job listings, or show a landing page to explain your project.

3. Manage static pages

Each page you create is automatically creating a file on the server. For example if you create a page in admin called “mypage”, this will create a new file “_tpl/{THEME}/static/static_mypage.tpl”. In the admin section you can manage links, pages and orders. To change the content of a static page simply insert your texts and HTML into relevant file.

How to add custom external links? This feature will be included in the updated version that will come out in 1 month (together with WYSIWYG editor). Until that time, you can make a quick workaround work for you. You can enter your custom links manually: Open website footer located in “_tpl/{THEME}/layout/footer.tpl” and enter your custom links. In the example code below, red colored text is the existing code and green colored text is the code for new custom external links.

<div class=”footer-roof”>
{foreach item=navitem from=$navigation name=i}
{if $smarty.foreach.i.last}
<a title=”{$navitem->title}” href=”{$BASE_URL}{$navitem->url}”>{$navitem->name}</a>
<a title=”{$navitem->title}” href=”{$BASE_URL}{$navitem->url}”>{$navitem->name}</a> |&nbsp;
 <a title=”Custom About us link” href=”” target=”_blank”>Custom About us link</a>
             <a title=”Custom Privacy policy link” href=”” target=”_blank” >Custom Privacy policy link</a>

4. Fill in SEO

Fill in your titles, keywords and descriptions. Connect Google Analytics.


5. Set up your categories, locations and job types

In today’s world the location is no longer that important. In the future remote work and digital nomadism is expected to rise. Therefore you have the option to turn your job board into a “remote” mode.

Remote mode

6. Set up new translations

Need your website in Hindi, German, Spanish, French, Czech or Russian? These translations are included by default! You just need to open “_config/config.envs.php” and change the website language to the one above. Example: ‘lang_code’ => ‘xy’, where xy is the code of your language (“hi”, “de”, “es”, “fr” and “ru” for the above). If you need to import a new language, follow the tutorial below.

In the admin area you can easily change the website wording / translations by clicking and saving. This is recommended for shared hosting users, who are not able to connect to their servers via command line. If you want to import a complete new language, there is a bit more “technical” approach how you can achieve this (to change all the texts, it is faster than clicking and filling in the backend).

a) Lets assume we want to import a German language and use it with our job board.

b) open “_tools/translations/src” folder. There you can find 4 basic website translations and German is already included. The language is in the key-value format, so you can easily go through and amend your website wording or send it to somebody to get it translated. In case you want to create and import new language, copy paste the existing folder, set your new language code and make the translation.

Translations folders


c) Open “_tools/translations/translations_in_db.php” and comment out the “die()” security command. Put your new language code in. In this guide we choose German, as we are going to import the German translations.

Translations second step

d) Connect to server via command line, navigate to the translations folder and run the script below. Your language will be imported into the website.

php translations_in_db.php 

e) Open “_config/config.envs.php” and set new language ‘lang_code’ => ‘en’  —> change to —> ‘lang_code’ => ‘de’.

f) Done. Website is now in German.

7. Set up email templates

Email templates are located within the translations section. Easiest way to change the template is to copy it into external editor, change it there and copy it back afterwards. This applies especially to HTML emails. Fast and satisfactory way is to use plain emails, without any formatting. You only need to keep the {bracket} structure, as the word in between the brackets will be replaced with dynamic content. (e.g. Your application for {JOB} —> will become –>Your application for Website Developer in NY).

If you want to test all your email templates at once, open index.php, find the line “email_debug.php” and ucomment it. Open that file and set the email address where the test emails will be delivered. After you run the website, you will receive all the existing emails used on the site. This way you can do some troubleshooting / designing. Some of the users who use shared hosting for their job board reported that their provider has been blocking their Gmail SMTP connectionsand it worked only with hosting provider SMTP details. So you have to try both in case of problems.

8. Change the design

For less HTML/CSS experienced users it is recommended, to download and use one of the ready made themes (new are under development), or request a theme customization from our team.

Frontend visual changes depend on CSS files, you can see all the paths included in the “_tpl/{theme}/layout/header.tpl” file. Lets assume we want to tweak the styles to create a blue website, that will be suitable for our brand. These are the steps to follow:

a) Main CSS file is located in “css/main.css”. You can amend this file directly, or change “sass/main.scss” and compile it with SASS. Inside a SASS file, you can find all the colors and constants defined in one place. Lets change the default gray main and accent color, to the blue one:

SASS styles

*update  – when customizing change the following variables to achieve quick results  – $color_main_theme [main site color], $color_main_theme_hover [links and buttons on hover color], $color_accent [accent color]

b) That was it! Now the last step is to save our changes and compile them, so they will take effect on the website. Following example uses Ubuntu / Debian installation commands, google the right command for your distribution.

1. Install SASS processor if you do not have it – connect to terminal and run:

sudo apt-get install ruby
sudo gem install sass

2. Navigate to the folder where is your “main.scss” file an run:

scss main.scss ../css/main.css

3. We have successfully compiled our SASS file into CSS. You can setup a watch, so it will be automatically compiled for you whenever you make a change. You can also minify your final CSS file with the  –style compressed switch. See THIS link for more options.

c) Lets see the final result. We got a nice blue website. Next steps would be to change the icons and loaders (located in “_tpl/{theme}/img” folder), to match our new design. Frontend consist of few pages, so even a complete theme redesign should be easy to achieve.

Design change


9. Change the code

Website follows Model-View-Controller software architecture. Data is stored in the MySQL database, frontend is handled by the Smarty templating engine and PHP controllers connecting these two main components.  In case you want to develop custom features specific for your job board, lets take a look at the project folder structure:

  • root folder important files: website installer.php, main website router index.php and all the ajax-call php files
  • admin  admin controllers and templates located within same folder
  • blog  website blog related files
  • _cache – main settings, translations and SEO are stored here, so they can be accessed repeatedly without loading
  • _config website configuration. The only file to edit is config.envs.php. Set up database connection, website language, register your plugins, change URLs 
  • controllers – main functionality is in here. Index.php is delegating web requests to this folder. Here, frontend templates are being assigned.
  • _lib – all website classes, working with the database
  • _tools – website translations, cron jobs
  • _tpl – website templates. To create your custom theme, create a folder and change the main settings in admin.
  • js – website assets and libraries. Admin support files.
  • plugins – additional functionality
  • uploads – website uploads – images, logos, invoices, CVs

10. Set up job alerts / newsletter – the easy way

The easiest way to send out a newsletter, is to use a transactional email provider. Go to Admin -> Subscribers -> Export to CSV, to export all email addresses into external file. You can after import this into any online service such as Amazon SES, Mailchimp or Mandrill and send your bulk emails.


11. Website maintenance and automatic job alerts / newsletter

On the website, we would like to do some cleaning, to keep the database small and efficient. Otherwise the expired jobs and data would just accumulate over the time. For less experienced users, there is a cleaner created in the admin. Every now and then, you can clear all the expired and temporary jobs from your website, with a click of a button.

Very useful for the maintenance of your job board is to setup automatic scripts (“Cron jobs”), that will do the job for us, so we do not need to click anything. Some users who use shared hosting, might not be allowed to run email sending Cron jobs. If that is the case, we suggest you use online service providers (google “online cron jobs” for more info).

In “_tools” folder, you can find some useful scripts for website maintenance and newsletter. These are great candidates to put inside Cron, and make them run automatically. Firstly, lets install the tool. For Ubuntu / Debian run:

sudo apt-get install cron

Access crontab scheduler crontab -e. Craft your command and save it. Use example below to get a picture how does it work. Example:

0 0 * * * cd /var/www/yourproject/_tools && php cron_maintenance.php > logs/cron_maintenance.log /dev/null 2>&1

Code above will run every day at midnight, delete all the expired and temporary jobs and log the result messages into a file. Example to setup a newsletter:

0 1 * * 1 cd /var/www/yourproject/_tools && php cron_weekly_newsletter.php > logs/cron_newsletter.log /dev/null 2>&1

Cronjob above will run once a week at 1AM, get all the latest jobs from the database, create a list of subscribers – and send them a newsletter email with latest job opportunities, organized by the category of their interest (I subscribed to marketing jobs, therefore I will receive only latest marketing jobs). For newsletter it is recommended to take a look at your email provider / server settings. So the sending will not get blocked. Simplejobscript newsletter script sends 90 emails in 24 hours – to prevent a blockage from mail provider. You can distribute this number throughout the week, to bypass the provider limits. Or alternatively, sign up with Amazon SES / paid SMTP plan to send more.

Download Simplejobscript HERE