[Tool/Web/Other] Basic SA:MP Website Template [CSS & HTML]

[Tool/Web/Other] Basic SA:MP Website Template [CSS & HTML] - Printable Version

+- SA-MP Forums Archive (https://sampforum.blast.hk)
+-- Forum: SA-MP Scripting and Plugins (https://sampforum.blast.hk/forumdisplay.php?fid=8)
+--- Forum: Filterscripts (https://sampforum.blast.hk/forumdisplay.php?fid=17)
+---- Forum: Tools and Files (https://sampforum.blast.hk/forumdisplay.php?fid=82)
+---- Thread: [Tool/Web/Other] Basic SA:MP Website Template [CSS & HTML] (/showthread.php?tid=506032)

Pages: 1 2

Basic SA:MP Website UCP [CSS / HTML / MySQL] - Flake. - 11.04.2014

Flake's Basic SA:MP UCP / Website

Information
Hello and welcome.. This is just a very basic and simple website design for a SA:MP community, it only took a few hours to put together and get running so I hope you all enjoy it.

UPDATE: Read the bottom of the post for updates, the UCP has now been added.

Screenshots
Demo: http://pds2k12.ml/Template/

(Sorry for the 800x600 res, I just shrunk it down a little to fit in in the forum post, but you get the picture.

Fetures
Like I said, it isn't much it's more of a project at the moment it'll be rocking the following:

Pop up tabs on the top left (When hover)
Copyright banner at the bottom (Easily editable)
A bunch of easy access defines to change the settings of the website

To edit the look/settings of the website just head over settings.php inside you'll see the following:

PHP Code:



        define('SVRNAME', 'Your Server Name');

    define('OWNER', 'Your name'); 

    define('SVRIP', '192.168.1.1'); 

    define('YEAR', '2014');

I'll update this thread when I update the github project too.

Download

Github Download
Mirrors are welcome

Updates

Added a sliding animation to the tabs on the top left
Added all the UCP CSS/PHP
Edited the top banner along with adding the .psd file for it
Made a transparent copy of every weapon for the UCP
Added the database drop the the github
The UCP Grabs your skin/weapons and shows them VIA a image
Fixed the FavIcon, made it look a little better

Credits

Me - Making the template (CSS & HTML)
Twizted - His amazing panaramic redner user for the header His Profile
Patrick_ - Aligned tabs along with hosting the demo

Re: Basic SA:MP Website Template [CSS & HTML] - Sublime - 11.04.2014

The whole thing looks subtle and matches the sublime pattern; but the navigation bar is not at the right place. I'd suggest to put it like horizontally near the main div box

Good job.

Re: Basic SA:MP Website Template [CSS & HTML] - Flake. - 11.04.2014

Quote:

Originally Posted by Sublime

The whole thing looks subtle and matches the sublime pattern; but the navigation bar is not at the right place. I'd suggest to put it like horizontally near the main div box

Good job.

Cheers for the feedback, I'll play around with it a little and try get it looking a little more flush.

Re: Basic SA:MP Website Template [CSS & HTML] - JeaSon - 11.04.2014

ofc its awesome

Re: Basic SA:MP Website Template [CSS & HTML] - iZN - 11.04.2014

rocking the following fetures features* Sorry for the nazi stuff.

Good job with the template.

Re: Basic SA:MP Website Template [CSS & HTML] - Flake. - 11.04.2014

Quote:

Originally Posted by iZN

rocking the following fetures features* Sorry for the nazi stuff.

Good job with the template.

haha, oops, didn't even notice I did that, cheers :P

Re: Basic SA:MP Website Template [CSS & HTML] - Patrick - 11.04.2014

Hey nice Template, looks very simply but I like how you designed the navigation bar, anyways I pulled a fixed navigation bar on Github (Pull Request) as it is not aligned, overall well done.

Example Website: http://pds2k12.ml/Template/ - You can see the website live.

Re: Basic SA:MP Website Template [CSS & HTML] - Flake. - 11.04.2014

Quote:

Originally Posted by Patrick_

Hey nice Template, looks very simply but I like how you designed the navigation bar, anyways I pulled a fixed navigation bar on Github (Pull Request) as it is not aligned, overall well done.

Example Website: http://pds2k12.ml/Template/ - You can see the website live.

Ah yeah! Cheers for that man, I'll chuck that demo link up on the main post.

Re: Basic SA:MP Website Template [CSS & HTML] - NewerthRoleplay - 11.04.2014

It looks a little bit strange on a 1080p display, obviously it's fine when I zoom in to 150% on chrome but yea: http://puu.sh/84xXe.jpg. Also when hovering over the first tab, there is a small gap between the header and navigation tab. I'm not a great fan of the simplicity of it, however I do love the pattern used on the background!

Re: Basic SA:MP Website Template [CSS & HTML] - Gus_Stone - 11.04.2014

Looks really good

Nice work!

Re: Basic SA:MP Website Template [CSS & HTML] - Flake. - 12.04.2014

Quote:

Originally Posted by Gus_Stone

Looks really good

Nice work!

Much appreciated.

Re: Basic SA:MP Website Template [CSS & HTML] - Sublime - 12.04.2014

You don't mind if I fork the website with the navigation bar positioned elsewhere (and making use of real-time JS animation?)

Re: Basic SA:MP Website Template [CSS & HTML] - ChandraLouis - 12.04.2014

can you add Mediafire/4Shared/2Shared/Solidfiles ?

Re: Basic SA:MP Website Template [CSS & HTML] - Flake. - 12.04.2014

Version 1.1 Update

Fetures
I'll keep this short and i'll update the main post too, pretty much I added a bunch more features to it and made it more like a UCP.

It uses whirlpool hash so you'll need to make sure your gamemode does that too or else you'll find yourself struggling to log in to your account..
I also made up a database drop that'll be in with the files on the github project, I tried to mirror most of the features of a RP server..

Updates

Added a sliding animation to the tabs on the top left
Added all the UCP CSS/PHP
Edited the top banner along with adding the .psd file for it
Made a transparent copy of every weapon for the UCP
Added the database drop the the github
The UCP Grabs your skin/weapons and shows them VIA a image
Fixed the FavIcon, made it look a little better

Download

Github Download V1.1

Screenshots

Side-Notes
Please.. Remember to update all the settings in settings.php (Yes! That does mean your mysql details) With out them it won't connect and you're going to have a bad day.

Re: Basic SA:MP Website Template [CSS & HTML] - Twizted - 12.04.2014

I know that picture in the banner. That's a cool template though; however, you could've went for a better choice of fonts.

Re: Basic SA:MP Website Template [CSS & HTML] - Flake. - 12.04.2014

Quote:

Originally Posted by Twizted

I know that picture in the banner. That's a cool template though; however, you could've went for a better choice of fonts.

Yeh I credited you in the main post

I'm still messing around with the fonts, I went with pricedown to get the 'san andreas' kind of look to it, I might change it up a little later.

Re: Basic SA:MP Website Template [CSS & HTML] - Twizted - 12.04.2014

Use Montserrat for body text. Simple yet very good looking font.

Re: Basic SA:MP Website Template [CSS & HTML] - JeaSon - 12.04.2014

great update

Re: Basic SA:MP Website Template [CSS & HTML] - Krisna - 12.04.2014

AWESOME !!!

Re: Basic SA:MP Website Template [CSS & HTML] - Sublime - 12.04.2014

http://sublimity.site90.com/

The new website demo if anybody needs it.

Your positions are all fucked, looks fucked in my monitor.