PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Facebook Button auf die Seite bekommen... komme nicht weiter


msilver
2012-05-23, 23:03:25
hi,
www.elitekoepfe.de ist noch die alte seite, auf:
http://elitekoepfe.de/page/
die version die online kommen soll.

oben die menügrafik ist bisher statisch, ich könnte dort mit einer html-map arbeiten, aber ich will die schrift leicht weich bewegen lassen wenn man drüber geht. kann ich das nur unterhalb der grafik machen oder auch IN der menügrafik?

zum anderen würde ich auch dieses facebook in der menügrafik haben wollen.

würde mich über jeglichen tip freuen, egal wie klein er auch ist. bin echt ein newbi in dem bereich, möchte oder kann selfhtml in seiner rohwut nicht lesen/verstehen.

ich nutze dreamweaver und editor!

lg
maik

AintCoolName
2012-05-24, 08:22:50
Sieht nicht so aus als hättest du dich nicht mit StyleSheets beschäftigt, das ist aber unumgänglich. Vielleicht solltest du "Dreamweaver" oder so etwas benutzen der dir ein paar Sachen abnimmt.

Das sollte ein div horizontal zentrieren:

<div style="margin:0 auto">FaceBook</div>

msilver
2012-05-24, 08:49:38
am liebsten wäre es mir sogar wenn das facebook kram in das menü mit drin "steckt" und auf deutsch sein würden.

habe aber mal deinen tip angewandt, leider ohne erfolg.

http://elitekoepfe.de/page/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Rodersdorf</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<style type="text/css">
<!--
body,td,th {
color: #FFFFFF;
}
body {
background-color: #000000;
background-image: url(back.png);
background-repeat: repeat;
margin-left: 0cm;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
.Stil3 {
font-size: 70px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
-->
</style>

</head>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//http://elitekoepfe.de/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});

// Additional initialization code here
};

// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
<body><div style="margin:0 auto">
<div class="fb-like" data-href="http://www.facebook.com/rodersdorf" data-send="true" data-layout="button_count" data-width="450" data-show-faces="false" data-font="arial"></div>
</div>
</div>
<div align="center"><img src="menu.jpg" width="800" height="300" border="5" usemap="#Map" />
</div>
<div align="center">
<p class="Stil3"><img src="111.jpg" width="165" height="550" border="2" /></p>
</div>
</body>
</html>

AintCoolName
2012-05-24, 09:49:57
mein Fehler das div braucht noch eine breite.

<div style="margin:0 auto;width:150px;">FaceBook</div>

Ich denke die Facebook buttons passen sich der Sprache an die im Browser eingestellt ist.

Der ganze Aufbau deiner Seite ist kurz gesagt "mist". Du solltest dir zum lernen andere Seiten anschauen. Am besten nimmst du Chrome oder FireFox mit FireBug und schaust dir andere Seiten mit dem Element Inspektor an. Dort kannst du genau sehen mit welchen StyleSheet angaben was erreicht wird.

Hier (http://css3-html5.de/alle-videos-in-einer-playlist/) gibt es ein schönen Workshop auf deutsch als Video (4Stunden) wie man eine Websteite mit allen Techniken erstellt, wirklich sehr gut erklärt.

Watson007
2012-05-24, 09:53:13
Sieht nicht so aus als hättest du dich nicht mit StyleSheets beschäftigt, das ist aber unumgänglich.

doppelte Verneinungs-Fail^^

also ich habe den Button problemlos auf mein Blog bekommen, das ist doch nicht schwer...

msilver
2012-05-24, 10:01:38
mein Fehler das div braucht noch eine breite.

<div style="margin:0 auto;width:150px;">FaceBook</div>

Ich denke die Facebook buttons passen sich der Sprache an die im Browser eingestellt ist.

Der ganze Aufbau deiner Seite ist kurz gesagt "mist". Du solltest dir zum lernen andere Seiten anschauen. Am besten nimmst du Chrome oder FireFox mit FireBug und schaust dir andere Seiten mit dem Element Inspektor an. Dort kannst du genau sehen mit welchen StyleSheet angaben was erreicht wird.

Hier (http://css3-html5.de/alle-videos-in-einer-playlist/) gibt es ein schönen Workshop auf deutsch als Video (4Stunden) wie man eine Websteite mit allen Techniken erstellt, wirklich sehr gut erklärt.

danke dir... ich werde vielleicht mal einen blog aufbauen, aber diese seite soll jahrelang so bleiben, bin aber eher ein grafiktyp, der gerne flyer baut, fotos macht, verändert... mir ist das ergebniss, sichtbar wichtig, aber mir fehlt die zeit in meinem stressigen alltag, mir jetzt für diese seite noch alles beizubringen, auf biegen und brechen. ich bin nicht faul, nur zeitlos.

facebook ist nun mittig und auf deutsch eingestellt... ein punkt weniger. DANKE

mit "weich" meinte ich das ich die zukünftigen buttons vielleicht mit einem weichen übergang zu einer anderen schriftfarbe versehen will, wie ich da hin kommen soll weis ich newbi aber wirklich nicht. ich werde regelrecht erschlagen von den ganzen infos, schaff es nicht zu differenzieren.

ich denke ich werde es dann wohl statisch lassen ;).

lg
maik

fdk
2012-05-24, 11:04:21
Das facebook-root div solltest du notfalls mit der position:absolute; keule erschlagen können.
Einen farbübergang bekommst du entweder mit javascript (jquery etc) oder css hin.
zB. farbänderung beim mouseover eines links per css;


a:hover {
color: red;
-webkit-transition: color .25s linear;
transition: color .25s linear; }


a:link, a:visited {
color: blue;<br />
-webkit-transition: color .25s linear .1s;
transition: color .25s linear .1s; }