PHPJunkyard support forum

Posted: **Wed Dec 10, 2008 1:25 pm**

/*************************************
Title: Graphical Counter with images
Version:
Author:
Demo: http://www.thehost4u.co.uk
Download:
Website: http://www.thehost4u.co.uk

Short description:

Adding code to this script so can use stylesheet and your own images similar to shown on my site.

*************************************/
No idea if an easier way and my first attempt at altering jscript file.

Remember to backup any files you change (e.g. graphcounter.php).

Following assumes your graphcounter folder is in site root .. (e.g. public_html/gcount), if elsewhere then make adjustment as required in the @import below.

1) Create your images and add them to a new folder in the styles folder (e.g. styles/myimages)

2) In your graphcounter.php file look for

Code: Select all

/* Print out Javascript code and exit */

add directly under that

Code: Select all

/* Part One of your style */

/* Place css stylesheet in same folder as your graphcount.php file and change the css filename below to match yours or if you already have a stylesheet for your website you can add your css to your current css stylesheet and ignore following 3 lines */

        echo 'document.write(\'<style type="text/css">\');';

        echo 'document.write(\'@import url("'.$base_url .'mystyle.css");\');'; 

        echo 'document.write(\'</style>\');';
	
        echo 'document.write(\'<div align="center"><div class="counter">\');';

        echo 'document.write(\'<div class="countertop"><div>Since 1st Dec 

2008</div></div>\');';

        echo 'document.write(\'<div class="countermid"><div 

style="text-align:center;padding-top:1px;">\');';

/* End of part one */

then look for

Code: Select all

exit();

place following directly above that

Code: Select all

/* Start of Part Two of your style */

        echo 'document.write(\'</div></div>\');';

	echo 'document.write(\'<div class="counterbot"><div>have visited this 

site</div></div></div></div>\');';

/* End of part two /*

/* That all folks */

3) If using seperate stylesheet for the counter then create a new css file using notepad or similar prog and add following:

Code: Select all

.counter {
	width:150px;
}

.countertop {
	background: url(styles/myimages/counter_top.gif) no-repeat;
	font-family:arial;
	font-size:11px;
	font-weight:bold;
	height:29px;
}

.countertop div {
	padding-top:14px;
}

.counterbot div {
	padding-top:1px;
}

.countermid {
	background: url(styles/myimages/counter_mid.gif) no-repeat;
	height:39px;
}

.counterbot {
	background: url(styles/myimages/counter_bot.gif) no-repeat;
	font-family:arial;
	font-size:11px;
	font-weight:bold;
	height:29px;
}

save your css as mystyle.css in same folder as your graphcounter.php file.

thats it.

obviously change any text, heights and image filenames to your own requirements

if prefer to download files then contact me and will get them on my website

PHPJunkyard support forum

Using stylesheet and your own images in GraphicalCounter

Using stylesheet and your own images in GraphicalCounter