zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Facebook-Einbindung – Styleänderung möglich?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 30.04.2011, 18:30
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.08.2009
Beiträge: 36
Sunlion befindet sich auf einem aufstrebenden Ast
Standard Facebook-Einbindung – Styleänderung möglich?

Ich habe auf einer Sportstudio-Webseite einen Bereich erstellt, in dem die Facebook-Seite des Studios als kleiner Überblick eingebunden wird:

Dokan Sportclub

Siehe etwas weiter unten und von den drei Bannern das rechte.
Der Hintergrund des Facebook-Bereichs ist weiß mit blauem Rand, ich hätte ihn aber gern transparent, damit er so aussieht, wie die beiden Banner links daneben. Alle meine Versuche mit allowtranparency="true" und background-color="none" oder "transparent" führten zu keiner Veränderung.
Erkennt einer von Euch, wenn er den Quelltext sieht, ob sich außer der Größe sonst noch etwas daran ändern läßt?
Der Bereich, wo Facebook eingebunden wird, lautet:

<script type="text/javascript"
src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US">
</script>

<script type="text/javascript">FB.init("12c142aca03256473dae42859e8a2 5e0");</script>

<fb:fan class="FB_fan FB_ElementReady" profile_id="231134128850" stream="1" connections="4" width="276px" height="441px"></fb:fan>


width und height sind soweit klar und lassen sich auch ändern, stream holt die Beiträge und connections gibt an, wieviele Follower-Fotos angezeigt werden sollen.
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 30.04.2011, 18:57
ofHouse
XHTMLforum-Mitglied
 
Registriert seit: 20.04.2011
Beiträge: 128
Borsti befindet sich auf einem aufstrebenden Ast
Standard

Die einzigen, bei denen ich das bisher gesehen habe, dass die den Frame von Facebook ändern, ist Spiegel Online.

Facebook hat da in der API was, wo man eine eigene CSS-Datei übergeben kann.

*google* *google*
Tadaa:
--> How to Customize Facebook Fan Page Widget
__________________
LG f

@ofhouse
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 30.04.2011, 19:02
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.08.2009
Beiträge: 36
Sunlion befindet sich auf einem aufstrebenden Ast
Standard

Du bist ein Schatz! *knuddel*
Hätte ich sicher auch finden können, aber mir fehlen da die richtigen Suchbegriffe. Es war schon schwierig, das zu finden, was ich da eingebaut habe.
Na jedenfalls probiere ich das mal aus.
Danke!
Mit Zitat antworten
  #4 (permalink)  
Alt 30.04.2011, 20:37
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.08.2009
Beiträge: 36
Sunlion befindet sich auf einem aufstrebenden Ast
Standard

Mhm ... also so richtig klappt das nicht. Ich habe zwar eine CSS-Datei erstellt und verknüpft, und tatsächlich ändert sich dann in dem Banner auch etwas, der Text „Dokan Sportclub“ ist nicht mehr blau und die a-Tags verändern sich. Ich habe den Eindruck, daß ich die richtigen Tags noch nicht identifizieren konnte.
In der CSS-Datei liegen nun folgende Formate, alle testweise mit Schriftgröße 20, damit die Veränderung sofort auffällt, aber irgendwie tut sich da nix:

hmtl {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px; font-weight:bold; text-align:right}
body {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px; font-weight:bold; text-align:right}


p {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
a {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
h1 {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
h2 {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
h3 {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
h4 {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
h5 {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
h6 {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}

.page_stream {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
.fan_box {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
.UIIntentionalStory {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
.UIStory_Message {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
.UIIntentionalStory_Names {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
.UIStoryAttachment {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
.UIStoryAttachment_Media {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
.UIStoryAttachment_MediaSingle {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
#UIStoryAttachment_Media {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
#UIStoryAttachment_MediaSingle {background-color:#000; font-family: arial, helvetica, sans-serif; color:#c3371e; font-size:20px; line-height:24px;}
Mit Zitat antworten
  #5 (permalink)  
Alt 30.04.2011, 22:03
ofHouse
XHTMLforum-Mitglied
 
Registriert seit: 20.04.2011
Beiträge: 128
Borsti befindet sich auf einem aufstrebenden Ast
Standard

Das bringt dir so nix.

Du musst eine extra CSS-Datei erstellen, die mit dem CSS von der Seite nix zu tun hat.
hast du ja, hab ich gerade gesehen
Ich hab damit auch noch nicht gearbeitet, deswegen nimm dir einfach zum Designen die Vorlage von Spiegel Online.
--> http://www.spiegel.de/static/sys/facebook/fanbox520.css
kopier den Inhalt in deine .css Datei auf deinem Server und dann ändere den Code.

einbinden musst du dann die CSS Datei folgendermaßen:
Hast du auch richtig
Code:
<fb:fan class=" FB_fan FB_ElementReady" width="276" height="441" locale="de_DE" logobar="0" connections="4" stream="1" profile_id="231134128850" css="PFAD zu deiner CSS Datei">
In dem Code sind Alle Parameter gesetzt (z.B. locale, logobar), die du in deinem ursprünglichen noch nicht hattest, deswegen kann sich da was verschieben.
__________________
LG f

@ofhouse

Geändert von Borsti (30.04.2011 um 22:09 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 30.04.2011, 22:51
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.08.2009
Beiträge: 36
Sunlion befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für Deine Mühe! Ich schaue mir das morgen mal an, hab den Rechner heute schon aus und sörfe gerade mit dem Handy. Nach der Spiegel- CSS-Datei hatte ich vorhin schon mal im Quellcode gesucht, war aber offenbar nicht gründlich genug. Ich sehe schon, da sind noch viel mehr Formate drin, als bei mir. Mal sehen, ob ich das morgen hinbekomme.
Nochmal vielen Dank und schönes Wochenende!
Mit Zitat antworten
  #7 (permalink)  
Alt 01.05.2011, 10:53
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.08.2009
Beiträge: 36
Sunlion befindet sich auf einem aufstrebenden Ast
Standard

Huuurrraaa!!!
Es funktioniert!
Dank Dir, Borsti, Du hast mir wirklich sehr geholfen!
*freu*
Mit Zitat antworten
Antwort

Stichwörter
einbinden, facebook, webseite

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Facebook Disclaimer? Blödsinn? undruck Offtopic 16 08.07.2011 16:37
Stirbt das Internet "dank" Facebook? Rayne Offtopic 6 25.01.2011 12:32
Facebook Connect: Facebook Avatar auslesen? sepp88 (X)HTML 1 11.03.2010 00:39
facebook fanfeld typo grösse ändern probot CSS 1 16.02.2010 14:25
HTML Einbindung in CSS twym CSS 5 09.07.2008 21:49


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:32 Uhr.