This is one the most important things to understand. As mentioned in How it works all the ages are not static, but generated 'on-the-fly' by the same script and you get different results based on request parameters and template. For example /scj/tube/index.php?group_name=phones outputs all images from 'phones' group, and /scj/tube/index.php?group_name=cars - from groups 'cars'. But on site you can use links like /category/phones/ and /category/cars/ - thanks to mod_rewrite

In this example /scj/tube/index.php?group_name=phones - group_name=phones is a GET parameter.

What you are supposed to understand after reading this information is how to pass parameters to /scj/tube/index.php and there are few ways to do it.

Option 1

Direct url to /scj/tube/index.php?group_name=phones .

2 - rewrites

Lets say we want to output group 'phones' using template 'super_template' , direct URL - /scj/tube/index.php?group_name=phones&force_template=super_template

Rewrite

RewriteRule ^super_phones\.html$ /scj/tube/index.php?group_name=phones&force_template=super_template

and you get an URL like this - http://yourdomain/super_phones.html.

3 - file

The same task for /scj/tube/index.php?group_name=phones&force_template=super_template. Create file super_phone.php

<?php
$_GET['group_name'] = 'phones';
$_GET['force_template'] = 'super_template';
include('./scj/tube/index.php');

and you get URL like http://yourdomain/super_phones.php

There are some tricks to get different titles for pages generated using the same template.

For example 'sort' : domain/category/asd/1/ctr/ and domain/category/asd/1/date/

<?php if ($_GET['order'] == 'ctr') {?>

<title>Site order by CTR </title>

<?php } elseif ($_GET['order'] == 'date') { ?>

<title>Site order by date </title>

<?php } else { ?>

<title>Default order (default = by ctr ) </title>

<?php } ?>

Add styles

<style>
div.rating-cancel,div.star-rating{float:left;width:17px;height:15px;text-indent:-999em;cursor:pointer;display:block;background:transparent;overflow:hidden}
div.rating-cancel,div.rating-cancel a{background:url(/scj/tube/delete.gif) no-repeat 0 -16px}
div.star-rating,div.star-rating a{background:url(/scj/tube/star.gif) no-repeat 0 0px}
div.rating-cancel a,div.star-rating a{display:block;width:16px;height:100%;background-position:0 0px;border:0}
div.star-rating-on a{background-position:0 -16px!important}
div.star-rating-hover a{background-position:0 -32px}
/* Read Only CSS */
div.star-rating-readonly a{cursor:default !important}
/* Partial Star CSS */
div.star-rating{background:transparent!important;overflow:hidden!important}
/* END jQuery.Rating Plugin CSS */
</style>

Add JS script to make stars selectable

<script src='/scj/includes/js/jquery.js' type="text/javascript"></script>
<script src='/scj/includes/js/jquery.rating.pack.js' type="text/javascript" language="javascript"></script>
<script>
$(function(){
	$('.auto-submit-star').rating({
		callback: function(value, link){
			$('#rating_div').html('Posting...');

			$.get('/scj/tube/index.php',
				{
				'content_id': '<!--GALLERY_MD5-->',
				'action': 'rating',
				'rating': value
				},
  			function(data) {
        	    $('#rating_div').html('Thank you!');
	  			}
			);
	}
	});
});
</script>

adding stars ..

<h4>Rate this movie:</h4> <div id='rating_div'>    
    <input class="auto-submit-star" type="radio" name="rating" value="1"/ <? if(<!--RATING--> > 0) echo 'checked' ?> >
    <input class="auto-submit-star" type="radio" name="rating" value="2"/ <? if(<!--RATING--> > 1) echo 'checked' ?> >
    <input class="auto-submit-star" type="radio" name="rating" value="3"/ <? if(<!--RATING--> > 2) echo 'checked' ?> >
    <input class="auto-submit-star" type="radio" name="rating" value="4"/ <? if(<!--RATING--> > 3) echo 'checked' ?> >
    <input class="auto-submit-star" type="radio" name="rating" value="5"/ <? if(<!--RATING--> > 4) echo 'checked' ?> >
</div>

That's it.

PS To output rating use <!–RATING–> - it's a number so you can show in any way you want it.

for example

<? if(<!--RATING--> > 0) echo '*' ?> 
<? if(<!--RATING--> > 1) echo '*' ?> 
<? if(<!--RATING--> > 2) echo '*' ?> 
<? if(<!--RATING--> > 3) echo '*' ?> 
<? if(<!--RATING--> > 4) echo '*' ?> 

and other 2-options rating systems

Actually the trick is simple: we leave only 2 options to choose. It's gonna be 1 and 2. Lets say 1 means “dislike”, and 2 - “like”. So if average is 1.5 that means 50% of visitors like it. 1.75 - means 75% like, 25 dislike. It should be clear.

What to do:

Add JS script

<script src='/scj/includes/js/jquery.js' type="text/javascript"></script> 

<script>
function post_rating(value) {

$.get('/scj/tube/index.php',
	{
	'content_id': '<!--GALLERY_MD5-->',
	'action': 'rating',
	'rating': value
	},
	function(data) {
   	    $('#rating_div').html('Thank you!');
	}
);

}

</script>

Adding vote buttons

<div id='rating_div'>
current rating = <?=(<!--RATING--> == 0) ? 'not rated' : round( (<!--RATING--> - 1) * 100 ) . '%'?> <br>
rate it: 

<span onclick='post_rating(2)' style="cursor: pointer"> +1 </span> ............................
<span onclick='post_rating(1)' style="cursor: pointer"> -1 </span>

</div>

+1 and  -1 can be replaced with whatever you want.

That's it )

Thumbs rolling is when we have lets say 5 thumbs from the same gallery and when you hover mouse cursor over a thumb it starts to show the rest of those 5 thumbs. Take a look at demo here example) and example 2.

How to do it

• add JS code into your template , it rotates thumbs with id starting with 'rot_'

<script src='/scj/includes/js/jquery.js'></script>

<script>
$(document).ready(function() {
	
	$("img[id^=rot]").bind('mouseenter', function() {
		$(this).attr('rotating', 1);
		StartSlide($(this).attr('id'));
	}).mouseleave(function() {
		$(this).attr('rotating', 0);
        if ($(this).attr('original_src')) $(this).attr('src', $(this).attr('original_src'));
	});

});


function StartSlide(id) {
	if (!$('#' + id).attr('rotating') || $('#' + id).attr('rotating') == 0) return false;

    if (!$('#' + id).attr('original_src')) $('#' + id).attr('original_src', $('#' + id).attr('src'));

	var images = $('#' + id).attr('original_src') + ',' + $('#' + id).attr('rel');
    images = images.split(',');
    var cur = $('#' + id).attr('current_img');

    cur = parseInt(cur);
    cur = (!cur || cur == 0) ? 1 : (cur+1);

    cur = (!images[cur]) ? 0 : cur;
    $('#' + id).attr('current_img', cur);

 	var preload = new Image();

	if (cur == 0) {
		preload.src = $('#' + id).attr('original_src');
	} else {
		preload.src = images[cur];
	}

    if ($('#' + id).attr('rotating')) setTimeout("ChangeSRC('"+id+"', '"+preload.src+"')", 700);		

}

function ChangeSRC(id, src) {
	if (!$('#' + id).attr('rotating') || $('#' + id).attr('rotating') == 0) return false;
	$('#' + id).attr('src', src);
    StartSlide(id);
}
</script>

• adding rot_ id to thumbs (changing subtemplate)

<a href="/gallery/<!--SAFE_DESC-->/<!--GALLERY_ID-->/index.html?<!--THUMB_LINK-->" title="<!--ALT-->">
<img id='rot<!--ID-->' src="<!--THUMB_URL-->" class="t_img" alt="" rel="<!--ALL_THUMBS-->" />
</a> 

notice 2 points here

id='rot<!--ID-->' - script rotates only those thumbs that has id starting with 'rot'
rel="<!--ALL_THUMBS-->" - here script enumerates all available thumbs for this gallery

it's pretty easy to translate site's menu (links like Most popular, Longest Videos and so on) into different languages.

1. Create custom template 'languages' with set of words like

<?php 
$my_keywords['en'] = array(
  'most_popular' => 'Most popular',
  'order_by_date' => 'Order By Date',
  and so on
);

$my_keywords['es'] = array(
  'most_popular' => 'Lo más leído',
  'order_by_date' => 'Ordenar por Fecha',
  and so on
);


$my_keywords['de'] = array(
  'most_popular' => 'Populärste',
  'order_by_date' => 'Sortiert nach Datum',
  and so on
);

and so on as many languages as you want.

Now you have 2 options to setup language for each user

using browser language

if (strstr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 'es')) {
  $lang = $my_keywords['es'];
} elseif (strstr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 'de')) {
  $lang = $my_keywords['de'];
} else $lang = $my_keywords['en'];

or geo_ip

if ($_SERVER['GEOIP_COUNTRY_CODE'] =='SP') {
  $lang = $my_keywords['es'];
} elseif ($_SERVER['GEOIP_COUNTRY_CODE'] =='DE') {
  $lang = $my_keywords['de'];
} else $lang = $my_keywords['en'];


Hopefully those examples are pretty self explaining 

at the ens of template you can add a cookie

if ($_GET['set_lng'] and isset($my_keywords[$_GET['set_lng']])) {
  setcookie('force_lng', $_GET['set_lng'], time() + 86400);
  $lang = $my_keywords['en'];
} elseif ($_COOKIE['force_lng'] and isset($my_keywords[$_COOKIE['force_lng']])){
  $lang = $my_keywords[$_COOKIE['force_lng']];
}

That's it for this template

2. Now you have to include this template into each template where you are going to use those words

<!--INCLUDE_TEMPLATE_languages-->

3. and replace words in templates with variables

Most popular ->  <?=$lang['most_popular']?>
Order By Date -> <?=$lang['order_by_date']?>
and so on

From this point it should work as it supposed to.

4. Now we want to add an ability for user to force switch to a selected language

add a link like 

http://domain/?force_lng=de (and so on any language based on your language array $my_keywords['de'])

That's it.