Register Arama Bugünkü Mesajlar Tüm Forumu Okundu Say

Reply
 
Thread Tools
[HOW TO - vB4] Customize the look of your modifications options page in adminCP
vB.Org Poster
vB.Org Poster has disabled reputation
Kayıt Tarihi: Jul 2018
Mesajlar: 298

Show Printable Version Email this Page
Makale: vBulletin 4 Makaleleri, yazan vB.Org Poster 09 Jul 2018, 23:52

Customizing the look and feel of your modifications options page is quite easy and can be used as a signature look or for advertising. We all know what the default options page looks like:

Attachment 138102

But with a little creativity you could be on your way to creating a cool customized look. The following image is a style I personally designed and will used for my mods as a 'signature' feel.

Attachment 138103

To do this, you will be inserting CSS into a settings block. Once you are done with your mod options, add one more setting block. Be sure to choose a unique varname and associate it with your group and product and make the title whatever you'd like. For me, my title is "Custom CSS for this page". Now the fun part. The description block can accept HTML and render it accordingly. Seeing as how our options page is its own page in an iframe, our custom CSS will only affect our options page. Here is what I put in my description block to get my custom signature look.

Kod Blok Kilitli:      (Kayıt veya giriş yapmalısın)  
Engellenmiş, kayıtlı olmayan veya onay bekleyen kişiler kodlara erişemezler.

If you are going to use my code as a reference, please be creative and come up with a style of your own. For Option Code just enter whatever, I put a copyright in my block.

Kod Blok Kilitli:      (Kayıt veya giriş yapmalısın)  
Engellenmiş, kayıtlı olmayan veya onay bekleyen kişiler kodlara erişemezler.

Leave everything else default and hit save. Now you can see your custom style come to life. It will take some time with Firebug to get the right classes/IDs for the elements you would like to alter.

Attachment 138107

Attachment 138104

Now you are wondering, how am I going to advertise if all I can do is alter CSS? Well, I'll tell you. If you add the following CSS:

Kod Blok Kilitli:      (Kayıt veya giriş yapmalısın)  
Engellenmiş, kayıtlı olmayan veya onay bekleyen kişiler kodlara erişemezler.

It will create a gap at the top of your options page. You can now set a background image to the body element and display what you'd like. My recommendation would be news about your mod, site etc and to host the image on your site so that if you want to update it for everyone who uses your mod then you can by overwriting the initial file.

Then I changed my original 'body' css declaration to

Kod Blok Kilitli:      (Kayıt veya giriş yapmalısın)  
Engellenmiş, kayıtlı olmayan veya onay bekleyen kişiler kodlara erişemezler.

My image was 800px by 200px.

Attachment 138105

I feel I don't need to say this but I will anyways. Yes, it is possible to embed external files with this method. I would recommend you not doing so, not only to protect the community, but to protect your reputation.

It's a mod, that being said I don't expect everyone who installs my mods to keep checking the mod options page and you should have the same perspective. That being said, make your styling worth it. First impressions are everything.
Views: 35
Reply With Quote
Reply

Thread Tools

Şunları Yapabilirsin
Yeni Konu Açmak
Konuya Cevap Yazmak
Eklenti Eklemek
Düzenleme Yapabilmek

Forum Atla


LD'de Yeni misin? Yardıma mı ihtiyacın var?

All times are GMT +3. The time now is 10:21.

Tasarım Özelliği | Genişlik: Geniş Renk: [HOW TO - vB4] Customize the look of your modifications options page in adminCP [HOW TO - vB4] Customize the look of your modifications options page in adminCP [HOW TO - vB4] Customize the look of your modifications options page in adminCP [HOW TO - vB4] Customize the look of your modifications options page in adminCP [HOW TO - vB4] Customize the look of your modifications options page in adminCP