24 Pagination Classes

[SamX]

Hi, i want to say thank you for this forum and i want to contribute with something, here is 24 new pagination styles.



1. Download the Styles

Code: Select all

http://rapidshare.com/files/255412661/Paginations_by_SamX.zip

2. Once choose your style open templates/your_template/Styles/styles.css
Go to the final and add the style code (styles includes on the css.css in zip)

Example of Yahoo pagination

Code: Select all

/*CSS yahoo style pagination*/

DIV.yahoo {
	PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center
}
DIV.yahoo A {
	BORDER-RIGHT: #fff 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #fff 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #fff 1px solid; COLOR: #000099; PADDING-TOP: 2px; BORDER-BOTTOM: #fff 1px solid; TEXT-DECORATION: underline
}
DIV.yahoo A:hover {
	BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #000; BORDER-BOTTOM: #000099 1px solid
}
DIV.yahoo A:active {
	BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #f00; BORDER-BOTTOM: #000099 1px solid
}
DIV.yahoo SPAN.current {
	BORDER-RIGHT: #fff 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #fff 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #fff 1px solid; COLOR: #000; PADDING-TOP: 2px; BORDER-BOTTOM: #fff 1px solid; BACKGROUND-COLOR: #fff
}
DIV.yahoo SPAN.disabled {
	BORDER-RIGHT: #eee 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #eee 1px solid; COLOR: #ddd; PADDING-TOP: 2px; BORDER-BOTTOM: #eee 1px solid
}

Save and upload your changes.

3. Open templates/your_template/Panels/CategoryPagingBottom.html and CategoryPagingTop.html once at time.

Find on line 1

Code: Select all

<div class="Block Moveable Panel PagingBottom" id="CategoryPagingBottom">

And remplace by

Code: Select all

<!---				<div class="Block Moveable Panel PagingBottom" id="CategoryPagingBottom"> -->
				<div class="yahoo" id="CategoryPagingBottom">
					%%SNIPPET_CategoryPaging%%
				</div>

Change the code on both pages CategoryPagingBottom.html and CategoryPagingTop.html, save and upload the files.

Thats All!

[Tony Barnes]

Nice - good little way to customise the look of a page

[Snooper]

I agree.. Just cant get it to work !!

[CharlieFoxtrot]

Great! Thank you!

[Snooper]

@ Charlie..

Err.. what?? I re-discover this posting and you say 'great' .. you got this to work ??

How for flip sake !??

[CharlieFoxtrot]

@ Charlie..

Err.. what?? I re-discover this posting and you say 'great' .. you got this to work ??

How for flip sake !??

I was just thanking the OP for the info and the file... I haven't had time to install it yet but it looks like a fairly straightforward process.

[Snooper]

Well I tried as told and for some reason it failed to implement for me.. This maybe because I'm using 5.5.4 and the mod itself was aimed lower..

Blimmin shame, it is a good mod to complement my text mod.. shifts ISC up a bar.. So anybody who gets this to work , please share..

[Brandeline]

I have this partly working on my sandbox for 6.1.1 with the meneame style. I had to make a couple of changes and there are probably a couple of other things I could do to make it smoother, but here are the changes I made to get it basically working:

Under the DIV.meneame A rule in the CSS code for the pagination class I wanted to use (meneame), I changed background-image: url(meneame.jpg) to background-image: url(../images/meneame.jpg) and dropped the supplied background image in my templates/<template name>/images directory. Only about three of the supplied themes have a background image at all, but if you pick one that does, you'll need to make this change to get it looking for it in your template directory.

I changed the rule DIV.meneame SPAN.active to DIV.meneame LI.ActivePage. This change was needed as 6.1.1 seems not to be using spans anymore. It uses LI elements instead, and the class name has also been changed to ActivePage.

Hope that helps those that still want to use it!

~Brandeline

[inb0x-]

I wanted to download the .zip file, but it says that does not exists, can you update the link, please?
Thanks.

[CharlieFoxtrot]

Here you go.