Demo

Probiere ClanSphere aus und teste daran herum. Demo


Antworten: 16
Seite [1]
dodger2876


Beginner




Herkunft: Mainz
Beiträge: 10
 # Thema - 06.02.2011 um 12:53 Uhr
Hi zusammen,

der BFBC2 - Clan in dem ich spiele betreibt seine Website auch mit ClanSphere.

Um die die Facebook, Twitter oder xFire Seite bekannter und leichter zugänglich zu machen würden wir die Buttons
dafür gerne auf der Seite platzieren. Idealerweise als Icons mit Link zum jeweiligen Profil als Block links oder rechts.

Wir würden das gleiche auch gerne mit einem "JOIN US" Button in einem Block machen der dann zu einem Sticky Thread
verlinkt oder einem Formular.

Wir wissen jedoch nicht wirklich wie das anzustellen ist. Kann mir hier jemand helfen?

Vielen Dank schon mal vorab.

Gruß,
Dodger


PS: war mir nicht sicher wohin der Thread gehört (hierher, Module, Design,...) Habe auch mit der Suche nichts passendes gefunden, da ich keine Ahnung habe wie ich nach dieser Frage suchen muß


Zuletzt editiert von dodger2876 am 06.02.2011 um 12:55 Uhr (1x Editiert)
Inaktiv
Swifter


Specialist





Beiträge: 1841
 # Antwort: 1 - 06.02.2011 um 14:27 Uhr
Schau mal auf unserer Seite unten rechts unter dem Kalender...
Da haben ich sowas auch eingebaut


------------------
Greetz Swifter


Wenn du dich klein, nutzlos, beleidigt und depressiv fühlst, denke immer daran: Du warst einmal das schnellste und erfolgreichste Spermium deiner Gruppe!
Inaktiv
|
Tress13


Highlander




Herkunft: Lüdenscheid
Beiträge: 3048
 # Antwort: 2 - 06.02.2011 um 14:43 Uhr
Brauchste kein Modul für.
Kann man auch hier sehen:

http://www.h34vy-w4t3r.de/

Packste dir einfach irgendwo mit rein.

 
1.
2.
3.
4.
5.
1. / 2. / ... 
 
<a href="http://www.twitter.com" class="twitter"></a>
<a href="http://www.youtube.com" class="youtube"></a>
<a href="http://www.facebook.com" class="facebook"></a>


Und halt die Klassen in deiner css zuordnen.


------------------


www.iv-gaming.de | www.iv-artwork.de

Inaktiv
|
dodger2876
Thread-Ersteller


Beginner




Herkunft: Mainz
Beiträge: 10
 # Antwort: 3 - 07.02.2011 um 12:52 Uhr
@swifter: So hatte ich mir das auch vorgestellt Wäre super, wenn Du einen CS-Noob erklären könntest, wie ich das umsetze.

Das könnte man doch dann für alle Arten von HTML-Content nehmen, oder? Wie z.B. einen "JOIN US" Button etc.

Ist das "No Cheat" Logo in den Bannern irgendwie geschützt oder kann man das problemlos verwenden?

@ Geekboy: Danke für den Tip! Im Header wollte ich es jetzt nicht unbedint haben.
BTW: wieso muß ich das im CSS zuordnen, ich könnte doch dann direkt einfach den Code mit IMG und Link einbauen.
Bzw. wie würde ich den das in die CSS einbinden?


Zuletzt editiert von dodger2876 am 07.02.2011 um 14:02 Uhr (3x Editiert)
Inaktiv
|
Tress13


Highlander




Herkunft: Lüdenscheid
Beiträge: 3048
 # Antwort: 4 - 07.02.2011 um 15:40 Uhr

@ Geekboy: Danke...




Du kannst das z.B. so machen. Musst du halt nur die Werte dafür anpassen.
Ausserdem die entsprechenden Icons dafür in den richtigen Ordner packen.

 
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
1. / 2. / ... 
 
.twitter {
       background-image: url('Bilder/Header/twitter.png');
    width: 50px;
    height:    50px;
    float: left;
    margin: 33px 0 0 531px;
}
.twitter:hover {
  background-image: url('Bilder/Header/twitter2.png');
}

.youtube {
        background-image: url('Bilder/Header/youtube.png');
    width: 50px;
    height:    50px;
    float: left;
    margin: 33px 0 0 3px;
}
.youtube:hover {
  background-image: url('Bilder/Header/youtube2.png');
}

.facebook {
        background-image: url('Bilder/Header/facebook.png');
    width: 50px;
    height:    50px;
    float: left;
    margin: 33px 0 0 2px;
}
.facebook:hover {
  background-image: url('Bilder/Header/facebook2.png');
}


------------------


www.iv-gaming.de | www.iv-artwork.de

Zuletzt editiert von Tress13 am 07.02.2011 um 15:42 Uhr (2x Editiert)
Inaktiv
|
dodger2876
Thread-Ersteller


Beginner




Herkunft: Mainz
Beiträge: 10
 # Antwort: 5 - 07.02.2011 um 15:57 Uhr
Hehe...hab das mit dem Geekboy jetzt erst geschnallt

OK, mal später ausprobieren. Kann dafür ja eine extra CSS anlegen oder besser in die Standard-CSS?

Positionen der Icons kann ich aber nicht verändern, oder? Da rechtsbündig der Clan-Text steht.
Inaktiv
|
Tress13


Highlander




Herkunft: Lüdenscheid
Beiträge: 3048
 # Antwort: 6 - 07.02.2011 um 16:02 Uhr
Kannste in irgend eine CSS rein packen.
Mit margin richtest du die Icons aus. Das bestimmt den Abstand in folgender Reihenfolge:

33px, 0, 0, 2px = oben rechts unten links


Das float machst du so:

wenn die Icons in die rechte Spalte kommen = float: right;
wenn sie in die linke Spalte sollen = float:left;


Die Höhe (height) und die Breite (width) musst du der Icongröße anpassen.


Mit nem Link zu deiner Page ist es einfacher.



------------------


www.iv-gaming.de | www.iv-artwork.de

Zuletzt editiert von Tress13 am 07.02.2011 um 16:03 Uhr (2x Editiert)
Inaktiv
|
dodger2876
Thread-Ersteller


Beginner




Herkunft: Mainz
Beiträge: 10
 # Antwort: 7 - 07.02.2011 um 16:12 Uhr
Mist...Session abgelaufen, Antwort weg :(

OK...von meinem CSS Grundwissen kommt mir das mit oben, rechts,... bekannt vor. Habs aber falsch interpretiert eben.

Die Clan-Seite ist www.angelsnrockets.com

Ich denke als Position (wenn im Header) wäre folgendes denkbar:
- rechts unten in die Ecke, horizontal
- rechts unten in die Ecke, vertikal
- links oben in die Ecke, horizontal

Die Icons sollten dann eben auch nicht zu groß sein


BTW: wüßtest Du auch wie die andere Idee von Swifter umsetzbar ist, könnten wir für einen "JOIN US" Button oder vll.t später mit "Paypal" gut gebrauchen


Inaktiv
|
Swifter


Specialist





Beiträge: 1841
 # Antwort: 8 - 07.02.2011 um 17:33 Uhr
 
1.
2.
3.
4.
5.
1. / 2. / ... 
 <div class="right_nav_top">Titel</div>
            <div class="right_nav_content">
            <div align="center"><a href="Link zur VZ Gruppe" target="_blank"><img src="Link zum VZ-Logo" alt="MeinVZ" title="MeinVZ" border="0" /></a></div>
<div align="center"><a href="link zur Facebookseite" target="_blank"><img src="Link zum Facebooklogo" alt="Facebook" title="Facebook" border="0" /></a></div>
            <div align="center"><a href="Link zur XFiregruppe" target="_blank"><img src="Link zum XFirelogo" alt="XFire" title="XFire" border="0" /></a></div></div>


Das is unser Code dafür....
Du müsstest noch die Divs anpassen (right_nav_top und right_nav_content) an deine Seite und natürlich die Links einbauen, an die entsprechenden Stellen...

Das nocheat Logo kannste verwenden...

Ansonsten einfach von der Seite mal den Quelltext ansehen, dann siehste auch schon wie das ungefähr aussehen muss


------------------
Greetz Swifter


Wenn du dich klein, nutzlos, beleidigt und depressiv fühlst, denke immer daran: Du warst einmal das schnellste und erfolgreichste Spermium deiner Gruppe!
Inaktiv
|
capino


Rock the board




Beiträge: 44
 # Antwort: 9 - 07.02.2011 um 17:56 Uhr
Ich krieg das nicht hin.

css... +-
.facebook {
background-image: url('images/facebook_off.png');
width: 50px;
height: 50px;
float: right;
margin-top: 10px;
}
.facebook:hover {
background-image: url('images/facebook_hover.png');
}

.xfire {
background-image: url('images/xfire_off.png');
width: 50px;
height: 50px;
float: right;
margin-top: 61px;
}
.xfire:hover {
background-image: url('images/xfire_hover.png');
}

.steam {
background-image: url('images/steam_off.png');
width: 50px;
height: 50px;
float: right;
margin-top: 112px;
}
.steam:hover {
background-image: url('images/steam_hover.png');
}

.gametracker {
background-image: url('images/gametracker_off.png');
width: 50px;
height: 50px;
float: right;
margin-top: 163px;
}
.gametracker:hover {
background-image: url('images/gametracker_hover.png');
}




Bei mir schauts dann so aus:


................................................................................ .Bild1
.........................................................................Bild2
.................................................................Bild3
.........................................................Bild4


Und den Rest schiebt es nach unten, also

......................................................................Bilder1-4

.................Header..................
...................SITE....................


Obwohl ich ja eigentlich einfach 4 Grafiken untereinander am rechten Bildrand will, also am Rand der eigentlichen Seite.
Ich hoffe, ihr versteht, was ich meine

p.s. kann es sein, dass es png gar nicht anzeigt? Wenn nicht, dann hab ich irgendwo noch nen 2. Fehler drin


Inaktiv
|
dodger2876
Thread-Ersteller


Beginner




Herkunft: Mainz
Beiträge: 10
 # Antwort: 10 - 07.02.2011 um 18:29 Uhr
@Swifter: Danke für den Code

Hab mal die index.html analysiert und bissl herumgespielt. Jetzt sieht es so aus (mit default Template): http://d.pr/9fve

Denke das sollte so passen. Hoffe ich krieg das Clan-Template bald zum Testen.


Zuletzt editiert von dodger2876 am 07.02.2011 um 18:31 Uhr (1x Editiert)
Inaktiv
|
Swifter


Specialist





Beiträge: 1841
 # Antwort: 11 - 07.02.2011 um 18:44 Uhr
capino:
Sind denn jeweils 2 grafiken vorhanden? die normale und die hover?

Wenn du nur die Grafiken rechts unten haben willst nimm meinen Code, dann haut das auch hin


------------------
Greetz Swifter


Wenn du dich klein, nutzlos, beleidigt und depressiv fühlst, denke immer daran: Du warst einmal das schnellste und erfolgreichste Spermium deiner Gruppe!
Inaktiv
|
capino


Rock the board




Beiträge: 44
 # Antwort: 12 - 07.02.2011 um 20:03 Uhr
Ja, hab ne hover und ne normale Grafik. Hab mal ein Bild gemalt, wie ich mir das vorstelle, damit wir nicht aneinander vorbei reden



Inaktiv
|
dodger2876
Thread-Ersteller


Beginner




Herkunft: Mainz
Beiträge: 10
 # Antwort: 13 - 07.02.2011 um 21:29 Uhr
Capino: woher hast Du denn die beiden Icons? Sehen nicht schlecht aus, vor allem die gleiche Größe und gleicher Style


Inaktiv
|
capino


Rock the board




Beiträge: 44
 # Antwort: 14 - 07.02.2011 um 22:48 Uhr
Die hab ich selbst gemacht. Ich hatte halt das Problem, dass es Facebook und xfire schon gibt, aber zu gametracker hab ich nichts passendes gefunden. Also kurzerhand mal schnell an Photoshot gesetzt und gemacht ^^


Inaktiv
|
dodger2876
Thread-Ersteller


Beginner




Herkunft: Mainz
Beiträge: 10
 # Antwort: 15 - 19.02.2011 um 20:00 Uhr
BTW: wir haben das jetzt so umgesetzt wie Swifter geschrieben hat und das auch für den JOIN US-Button genutzt...finde sieht gut aus:
www.angelsnrockets.com

Danke nochmal !!


Inaktiv
|
Swifter


Specialist





Beiträge: 1841
 # Antwort: 16 - 19.02.2011 um 20:18 Uhr
Wenn Du nu noch das About bzw. Scriptinfo wieder einbaust, sind wir alle zufrieden


------------------
Greetz Swifter


Wenn du dich klein, nutzlos, beleidigt und depressiv fühlst, denke immer daran: Du warst einmal das schnellste und erfolgreichste Spermium deiner Gruppe!
Inaktiv
|
Antworten: 16
Seite [1]


Sie müssen sich registrieren, um zu antworten.