Desperado Sample

Desperado Sample

Desperado Trail is a Premium template. Here is some helpful information pertaining to the template:

Design Details

Template type PREMIUM – HTML5
Control panel version 3
Supports categories YES
Contact form YES
Supports logo YES
Slideshow in gallery YES

Site Colors Settings:

Go to Site Settings/Colors in your site control tools

You will find the ability to change about nine(9) colors from the Colors section.

Color Name Color Description
Title Color: Colors the logo if no logo file is used.
Text Color: Colors the page text, header text, and contact form text.
Body Color: Colors the body background. If a texture file is specified it will overlap this color.
Secondary Color: Colors the background of the main container.
Border Color: Colors border and line elements.
Page Background Color: Not used.
Custom Color 1: Colors the menu items, copyright text, gallery navigation, any page links (including sub page links), scroll bar drag buttons, audio player buttons, thumbnail button, and slideshow icon.
Custom Color 2: Colors the items colored by custom color 1 on mouse over where a mouse over state exists.
Custom Color 3: Colors the menu and submenu background boxes, portfolio label boxes, audio and video progress bars, and scroll bar tracks.

Image Sizes

All images should be uploaded to your image bank and optimized for the web.

Desperado allows you to set your own content width. See the ‘Content width’ setting under Special Features for more information. Intro and Gallery images, as well as the image for the contact page should match that setting minus 40 pixels, which is the default amount of padding between the edge of the container and the images. Page images can be as wide as gallery and intro images, or than can be narrower. If they are narrower than the available page space, text will wrap around the image.

The default content width setting is 1000 pixels. This would mean your gallery and intro images should be 960 pixels (1000-40=960). Page images could be up to 960 pixels wide.

Image Width Height
Intro images 960* 640*
Gallery images 960* 640*
Page images ≤ 960* ≤ 640*

*These sizings are based off the default content width of 1000 pixels. Width settings for each image should be the content width settings minus 40 pixels.

Special Features / Template Settings

Content width

Enter the desired width of the content area under Site Settings > Template Settings. ex: 1000

Intro Images

Under Site Settings > Intro/Texture upload images for the intro or background image that appears when your site opens. Press the upload new file button under Background/Intro and select a new image to upload. Intro images should be optimized and sized according to the template image specifications. Drag and drop the images to reorder them. Press the delete button on the right to delete an image.

Page Linking

To make a page link redirect to some other page (ie. Put the following as the first and only text in the page text: REDIRECT:


Music is uploaded into the music area under Site Settings. The jukebox will read ID3 tags from MP3 files. Depending on what music player you use, you may have to “Convert ID3 Tags…” before they are uploaded to your site. Otherwise the jukebox will not be able to read the song/artist information.

Slideshow speed

Under Site Settings > Template Settings enter the amount of time in seconds an image should display in intro and gallery slideshows before loading the next image.

Auto start slide show

Under Site Settings > Template Settings enter ‘yes’, ‘on’, or ‘true’ to have the gallery slide show auto start when entering a gallery.

Texture file

Upload an image for the background texture under Site Settings > Intro/Texture. Press the upload new file button under Texture and select a new image to upload. Texture images should be sized to a minimum of 1400 x 1050 pixels. To remove the texture press the delete button to the right of the image.

***Textures are an easy way to set your site apart and give it depth. We have an incredible set of texture packs to choose from created directly by our developers for you HERE.

Portfolio menu label

Under Site Settings > Template Settings enter the desired label for the button that opens the portfolio menu.

Contact menu label

Under Site Settings > Template Settings enter the desired label for the button that opens the contact form.

Image captions

To create a caption for an image click on the desired image under Images > Image Bank**. In the caption field enter a few sentences to describe the image. When the image shows up in a gallery on your site, the caption will appear over the image.
** You may need to wait for the entire image bank page to load before you can enter a caption.

Font modifiers

Font Modifiers allow you to increase or decrease the size of the text from its default size (set at 0) for your Site Title, Navigation, and Pages. This is most helpful when selecting fonts that render at small sizes.


A good place to start is around 200 width by 70 height in pixels. If you need the logo bigger/smaller, just resize the logo in your image editing program and then re-upload into the admin.

Logo Design
Need to re-brand your logo? We have a great logo design team that can help you make that impact in your business. Check out our logo services HERE and take it to the next level.

Social Media

It is possible to add social media icons and links to Desperado. Under Site Settings > Profile under the Social Media section, add a reference to the image for a given social network and a link to a page on that network using the following format:


In this case, the images ‘facebook.png’, and ‘twitter.png’ should be uploaded to the image bank. Both pngs and jpgs can be used for these icons. There are many places to find social media icons for your site. Here is an example of one set.

Social media icons can also be added to the bottom of any page or the contact form by adding the same code found in Site Settings > Profile prefixed by the text ‘SOCIAL MEDIA:’. The final text should look like this at the bottom of the page text section:


Browser scroll mode

Desperado has two scroll modes, “auto” and “none”. Auto uses the standard browser scroll mode with a standard browser window scroll bar as needed to accommodate content taller than the browser window. None scales all content to fit within the available browser height. Page text uses a scroller inside the main container if needed. Gallery and Intro images scale to fit within the available space without the need to use the browser scroll bar. Enter the desired setting under Site Settings > Template Settings in the Browser scroll mode field.

Featured category

You can set a category to be featured under the intro image section. If you set the Featured category setting under Site Settings > Template Settings to a category within the Images area of the admin, it will show up beneath the intro image section on the home page of the site. This feature will only work if the browser scroll mode is set to auto.

Intro video

An intro video can be shown instead of an intro slideshow. A video must be uploaded via FTP into the httpdocs/videos/ folder. To request FTP access, submit a ticket to The video must follow the following specifications:
Video Format: M4V
H.264 Baseline Profile Level 3.0 video, up to 640 x 480 at 30 fps. Note that B frames are not supported in the Baseline profile.
AAC-LC audio, up to 48 kHz.
Once the video has been uploaded, set the Intro video setting under Site Settings > Template Settings to the filename of the uploaded video file. Once entered, the video will show up instead of the intro slideshow.

Other video

Because Desperado is an HTML site, you can embed youtube, vimeo, and other third party video players. Simply paste embed code on a page using the simple text editor when editing a page. The simple text editor can be accessed from the simple text editor link under the rich text editor when editing a page.

Redirect target

Page redirects can be set to open in the same window as the site by setting the Redirect target under Site Settings > Template Settings to “_self”. This can also be set to target a given window name so all redirects open in a given new window. Otherwise all redirects will open in a new window by default.

Help & Support

Submit a Support Ticket »

© 2020 BIG Folio Inc. • All rights reserved
Terms and Conditions