FBML Seite auf Facebook

Seite 1 von 1 - Forum: Coding Stuff auf overclockers.at

URL: https://www.overclockers.at/coding-stuff/fbml-seite-auf-facebook_223297/page_1 - zur Vollversion wechseln!


slateSC schrieb am 03.04.2011 um 23:56

Bin gerade dabei eine FBML Seite zu erstellen und hab noch ein paar kleine Startschwierigkeiten..

Die einzubindende Seite liegt auf einem externen Server
und den Bereich vom div bis zum Style hab ich in Facebook integriert.

Link zur Seite am Server
Link zur FBML Seite

Hab jetzt folgende Proble:

1. Im Internet Explorer wird sie gar nicht angezeigt
2. der css Style dürfte irgendwie nur zur hälfte greifen - für die schriften nimmt er
anscheinend nur die browser eigenen css stile!?
- warum ich den css style so eigenartig eingebunden habe? - habe mich nach dieser anleigung orientiert
3. wolte im ersten div auch einen Teilen Button einfügen, der mir allerdings nicht
angezeigt wird (sieht man im code der seite am server)
- ist ein code der auf einer der hilfeseiten zu finden war

Dank euch schon wieder mal im voraus! ;)


SilentBob schrieb am 04.04.2011 um 01:01

im IE9 wird sie angezeigt
habe jetzt überhaupt keine Erfahrung mit Facebook, aber es scheint halt so, als würde Facebook hier neue CSS Klassen ".app_content_4949752878 .a ..." erstellen, damit deine CSS Klassen nicht mit denen von FB vermischen
er nimmt halt einfach nicht die body und html mit, sonst würden sie ja die von FB überschreiben (oder zumindest einen Konflikt auslösen)

also ich glaube halt, du kannst html und body nicht neu definieren, würde also das ganze div in eine klasse reingeben und dort die font einstellen

beim fb button kenne ich mich gar nicht aus, sieht aber nach fehlenden Hochkomma aus


slateSC schrieb am 23.04.2011 um 02:36

sorry ich hab das hier ganz übersehen!

danke für deine hilfe!
das problem mit dem Teilen Button konnte ich schon lösen!
das mit dem div muss ich mir ansehen! klingt interessant! ;)

was mir aber nach wie vor kopfzerbrechen bereitet ist der internet explorer...
Dürfte dann anscheinend alle versionen unter IE9 betreffen!
Da wird einfach nur der text ohne formatierungen und ohne grafik eingefügt!
Hab leider im Moment keinen da damit ich mir das selber genauer anschauen kann...

vielleicht hat ja doch jemand einen tipp für mich!

edit: das mitm css klappt super!

edit2: hmm... so wie es aussieht dürfte der <IE9 das gesamte css ignorieren wenn
nicht mal die grafik angezeigt wird...

edit3: gibts eigentlich eine möglichkeit die link definitionen ebenfalls in den div stil zu packen?
sonst bleiben die immer facebook blau...

edit4: hab jetzt ein externes css eingebunden! theoretisch sollts jetzt mitm IE klappen...
kann mir das vielleicht wer bestätigen?


Daeda schrieb am 23.04.2011 um 09:07

Zitat von slateSC
edit3: gibts eigentlich eine möglichkeit die link definitionen ebenfalls in den div stil zu packen?
sonst bleiben die immer facebook blau...

hm bisher hast ja nur die text-decoration der links angegeben, ein einfaches a { color: #xxx; } sollt reichen. bzw auf nummer sicher gehn und .wrapper a { color: #xxx; } angeben, damits a höhere wertigkeit als der fb-style hat.

Zitat von slateSC
edit4: hab jetzt ein externes css eingebunden! theoretisch sollts jetzt mitm IE klappen...
kann mir das vielleicht wer bestätigen?

mit ie8 funktionierts bei mir

Zitat von slateSC
vielleicht hat ja doch jemand einen tipp für mich!

- die 3 logos der hotels wirken ziemlich gequetscht, vor allem die beschreibungen davon sind kaum lesbar (zB boutique hotel)
- beistriche sind zwar meine schwäche, aber vom gefühl her würd ich nach Marktplatz, Köstlichkeiten, Aromagrotte, lädt ein, Geheimtipp jeweils einen hinsetzen. und dafür den nach Sonnenterrasse entfernen
- die & würde ich durch "und" ersetzen, aber das ist geschmackssache
- generell - wenn man text in bildern verwendet, sollte die qualität passen, damits gut lesbar ist. gif's eignen sich da mMn überhaupt nicht - gilt auch für die derzeitige prepage (wo übrigends auch das impressum fehlt)


slateSC schrieb am 23.04.2011 um 13:25

hab den css stil jetzt mit:

Code: PHP
.wrapper a:link { color:ffffff; text-decoration:underline; }
.wrapper a:visited { color:ffffff; text-decoration:underline; }
.wrapper a:hover { color:cc9900; text-decoration:none; }

das zeigt aber gar keine wirkung?

bzgl. IE dürfte es dann echt am externen css gelegen sein!

bzgl. tipps:
was würdest du sonst nehmen ausser gif?
btw. das von der fbml Seite ist ein jpg im Hintergrund!


Daeda schrieb am 23.04.2011 um 13:34

Zitat von slateSC
hab den css stil jetzt mit:
Code: PHP
.wrapper a:link { color:ffffff; text-decoration:underline; }
.wrapper a:visited { color:ffffff; text-decoration:underline; }
.wrapper a:hover { color:cc9900; text-decoration:none; }

das zeigt aber gar keine wirkung?

bzgl. IE dürfte es dann echt am externen css gelegen sein!
hast die # vor den farbcodes nur hier vergessen oder im code auch? ;)
sollte so aussehn:
Code: PHP
.wrapper a:link { color:#ffffff; text-decoration:underline; }
.wrapper a:visited { color:#ffffff; text-decoration:underline; }
.wrapper a:hover { color:#cc9900; text-decoration:none; }

wobei die gekürzte form ca. so aussehn würde:
Code: PHP
.wrapper a { color:#ffffff; text-decoration:underline; }
.wrapper a:hover { color:#cc9900; text-decoration:none; }
soweit ich weiß, gilt "a" ohne zusatz für alle zustände (link, visited, ..), wo nicht explizit etwas anderes angegeben wird, wie in diesem fall für a:hover.
falls so aber noch weniger geht als vorher, lass es so wies war. bin selbst noch am learning-by-doing :D

Zitat von slateSC
bzgl. tipps:
was würdest du sonst nehmen ausser gif?
btw. das von der fbml Seite ist ein jpg im Hintergrund!
jpg wär schon ok, aber da kommts halt stark auf die einstellung an, mit der das bild gespeichert wird. ansonsten könntest noch png versuchen.


slateSC schrieb am 23.04.2011 um 13:56

das ist jetzt allerdings peinlich! :D
Mit # funktionierts sogar!

was mir jetzt bzgl. format/auflösung/qualität nicht ganz klar ist, was es an dem jetzigen
Hintergrundbild auszusetzen gibt? - habs bevor ich es als jpg. mit 80% gespeichert habe
extra noch mal nachgeschärft damit es dann nicht zu verwaschen aussieht!?

in der schule hieß es immer jogos und text als gif und bilder als jpg/png!?

Das die Logo "unterschrift" zu klein und nicht leserlich ist ist mir klar, aber da kann ich halt schwer was dagegen machen...
Mein ziel war es halt dass es möglichst kompakt bleibt! damit man mitm laptop möglichst gleich alles auf einen blick sieht!


HP schrieb am 23.04.2011 um 18:50

Was macht eine FBML Seite?


kleinerChemiker schrieb am 24.04.2011 um 13:53

Zitat von HP
Was macht eine FBML Seite?

FBML enables you to build Facebook applications that deeply integrate into a user's Facebook experience.
https://developers.facebook.com/docs/reference/fbml/


ABER: We are in the process of deprecating FBML. If you are building a new application on Facebook.com, please implement your application using HTML, JavaScript and CSS. You can use our JavaScript SDK and Social Plugins to embedded many of the same social features available in FBML. While there is still functionality that we have not ported over yet, we are no longer adding new features to FBML.




overclockers.at v4.thecommunity
© all rights reserved by overclockers.at 2000-2025