HowTo - Create your own Theme - Better Battlelog Forums #1660

Sitemap
Post edited 2 x times, last by
Topicstarter
Hi all Theme Developers.

Since BBLog have Themes integrated it's possible for everyone to create own themes. Web-Developer pro's should know all hints i write in this thread but maybe this thread is helpfull for all.

First of all -
http://getbblog.com/viewtopic.php?f=17&t=359


So - For all beginners in Web-Developing/CSS-Developing i have some hints for you.

[*] Basics of CSS to style a website:
http://www.w3schools.com/css/


[*] Use of images in CSS without need of image files - With Data URI - Here is a free online image converter:
http://dataurl.net/#dataurlmaker

Add generated code in background-image:url({CODE});
[*] Use Browser Development/Inspector/Console to find elements and used classes and styles to an element.
For Firefox
http://getfirebug.com/

For Chrome just press F12.

[*] Test all things with both browsers. BBLog running on Firefox and Chrome.
Some advanced hints to make development much easier for advanced user's.

[*] If you have installed a local webserver (or have an online server) you can use @import "http://myurltomycssfile";
Now you can edit files locally with your favourite editor instead of using the online BBLog editor.
For example the popular portable webserver is a good choice for this usage (if you don't have one):
http://www.apachefriends.org/en/xampp.html


[*] Use advanced CSS 3 things. Both browser support huge variety of new CSS 3 features like transations, animations, etc...

Something to think about
:
If you're a console player, keep in mind that some elements of Battlelog are not visible to you. Get someone that has Battlefield 3 on PC to confirm that your theme is working as it should.
brain wrote:
[*] If you have installed a local webserver (or have an online server) you can use @import "http://myurltomycssfile";[/*:m]

Didn't think about that. Cool tip. Thanks.

If someone isn't familiar with local servers:
http://www.wampserver.com/en/
(win)
http://www.apachefriends.org/en/xampp.html
(win, mac, linux)
http://www.mamp.info/en/index.html
(mac)

Personally I prefer wamp over xamp (obviously I'm on a windows machine).
Topicstarter
seniledawdler wrote:
Personally I prefer wamp over xamp (obviously I'm on a windows machine).

The portable version of XAMPP is for this use the best choice (if you don't have a webserver actually). Easiest to install.
brain wrote:
The portable version of XAMPP is for this use the best choice (if you don't have a webserver actually). Easiest to install.

I have it on one of my external hard drives with other portable apps. Can't say anything about the installation stuff, as it's been many years since I installed wamp and year or two since I last installed xamp. Either way, they all most likely are way easier to install than Apache, MySQL and
PHP on their own. :D

This guide could use a word or two (or pictures) on differences of battlelog for console vs pc users. Also if there are some buttons that only appear under certain conditions, or maybe moderators there have some secret buttons and whatnot. Even knowledge of said buttons and whatnot, without access to them, could benefit us theme people so we don't unknowingly destroy some pages and usability by not taking into account something that we're not aware of.
So theme ppl get ready. Battlefield Premium will be released soon. Two hours from now, Battlelog will supposedly be turned off until the press conference on E3, where the Premium will be released. After they bring battlelog back, it will certainly need some theme fixing and polishing ;)

Expect 5 hour downtime starting in two hours.
Console players can't see the server browser anymore?
seniledawdler wrote:
Console players can't see the server browser anymore?

Looks like it's hidden away for them. This is a neat feature, though, considering that console players have no need for it what so ever.

If you need to style it in your theme you should visit
http://battlelog.battlefield.com/bf3/servers/
it still works to visit the browser.
xXJumpyXx wrote:
If you need to style it in your theme you should visit
http://battlelog.battlefield.com/bf3/servers/
it still works to visit the browser.

Thank you. :)
"To activate Theme Developing in Battlelog just press ALT+SHIFT+3 (BBLog must be installed)"

this feature is still available?
because if i press those keys, nothing happens
pacheddu wrote:
"To activate Theme Developing in Battlelog just press ALT+SHIFT+3 (BBLog must be installed)"

this feature is still available?
because if i press those keys, nothing happens


Since BBLog 3 this feature is not included, I recommend using Stylish plugin for theme developing.