[GELÖST] Ein zweites Bild oder Text rechts neben dem Header Logo
[GELÖST] Ein zweites Bild oder Text rechts neben dem Header Logo
Hallo
Ich wollte mal dummerweise fragen (Sorry bin noch ziemlich neu hier bei cmsmadesimple) wie man oben im Header ausser dem Header Logo Links noch ein weiteres Bild oder Banner oder Text oder Flaggen einfügen könnte. Habe schona lles mögliche rumgebastelt aber es haut nicht hin. Ich will auch nicht dass der gesamte Header ein Link auf die Homepage ist sondern nur das Logo Bild auf der linken Seite. Weis mir da jemand ausführlich zu helfen?
Was muss ich an diesem Code ändern oder wird das anderswo gemacht?
margin:0;
padding:0;
}
/*
Set initial font styles
*/
body {
text-align: left;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 75.01%;
line-height: 1em;
}
/*
set font size for all divs,
this overrides some body rules
*/
div {
font-size: 1em;
}
/*
if img is inside "a" it would have
borders, we don't want that
*/
img {
border: 0;
}
/*
default link styles
*/
/* set all links to have underline and bluish color */
a,
a:link
a:active {
text-decoration: none;
color: #18507C;
}
a:visited {
text-decoration: none;
color: #18507C; /* a different color can be used for visited links */
}
/* remove underline on hover and change color */
a:hover {
text-decoration: underline;
color: #385C72;
}
/*****************
basic layout
*****************/
body {
background-color: #ccc;
color: #333;
margin:1em; /* gives some air for the pagewrapper */
}
/* center wrapper, min max width */
div#pagewrapper {
border: 1px solid black;
margin: 0 auto; /* this centers wrapper */
max-width: 80em; /* IE wont understand these, so we will use javascript magick */
min-width: 60em;
background-color: #fff;;
color: black;
}
/*** header ***
we will hide text and replace it with a image
we need to assign a height for it
*/
div#header {
height: 80px; /* adjust according your image size */
background: #FF9933;
}
div#header h1 a {
/* you can set your own image here */
background: #FF9933 url(images/cms/logo1.gif) no-repeat 0 12px;
display: block;
height: 80px; /* adjust according your image size */
text-indent: -999em; /* this hides the text */
text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}
Beste Grüsse aus Spanien
otty
Ich wollte mal dummerweise fragen (Sorry bin noch ziemlich neu hier bei cmsmadesimple) wie man oben im Header ausser dem Header Logo Links noch ein weiteres Bild oder Banner oder Text oder Flaggen einfügen könnte. Habe schona lles mögliche rumgebastelt aber es haut nicht hin. Ich will auch nicht dass der gesamte Header ein Link auf die Homepage ist sondern nur das Logo Bild auf der linken Seite. Weis mir da jemand ausführlich zu helfen?
Was muss ich an diesem Code ändern oder wird das anderswo gemacht?
margin:0;
padding:0;
}
/*
Set initial font styles
*/
body {
text-align: left;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 75.01%;
line-height: 1em;
}
/*
set font size for all divs,
this overrides some body rules
*/
div {
font-size: 1em;
}
/*
if img is inside "a" it would have
borders, we don't want that
*/
img {
border: 0;
}
/*
default link styles
*/
/* set all links to have underline and bluish color */
a,
a:link
a:active {
text-decoration: none;
color: #18507C;
}
a:visited {
text-decoration: none;
color: #18507C; /* a different color can be used for visited links */
}
/* remove underline on hover and change color */
a:hover {
text-decoration: underline;
color: #385C72;
}
/*****************
basic layout
*****************/
body {
background-color: #ccc;
color: #333;
margin:1em; /* gives some air for the pagewrapper */
}
/* center wrapper, min max width */
div#pagewrapper {
border: 1px solid black;
margin: 0 auto; /* this centers wrapper */
max-width: 80em; /* IE wont understand these, so we will use javascript magick */
min-width: 60em;
background-color: #fff;;
color: black;
}
/*** header ***
we will hide text and replace it with a image
we need to assign a height for it
*/
div#header {
height: 80px; /* adjust according your image size */
background: #FF9933;
}
div#header h1 a {
/* you can set your own image here */
background: #FF9933 url(images/cms/logo1.gif) no-repeat 0 12px;
display: block;
height: 80px; /* adjust according your image size */
text-indent: -999em; /* this hides the text */
text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}
Beste Grüsse aus Spanien
otty
Last edited by ottyscom on Tue Dec 11, 2007 6:42 pm, edited 1 time in total.
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Hola otty
willkommen bei CMS made simple.
Ist das die Ganze CSS, die du deinem Template zugeordnet hast?
Das, was du meinst (das CMSms Logo), ist das Hintergrundbild für den Link auf h1 im Header. Wenn du das nicht willst, musst du es einfach rausschmeißen.
In den CMSms-Standard-Templates sind zwei Stylesheets definiert, die dir eventuell weiterhelfen könnten, konkret .left49 und .right49. Versuch mal folgendes in deinem Template zu ändern
(natürlich mit dem Link auf deine Bilder
...)
willkommen bei CMS made simple.
Ist das die Ganze CSS, die du deinem Template zugeordnet hast?
Das, was du meinst (das CMSms Logo), ist das Hintergrundbild für den Link auf h1 im Header. Wenn du das nicht willst, musst du es einfach rausschmeißen.
In den CMSms-Standard-Templates sind zwei Stylesheets definiert, die dir eventuell weiterhelfen könnten, konkret .left49 und .right49. Versuch mal folgendes in deinem Template zu ändern
Code: Select all
<div id="header">
<div class="right49">
<img scr="Bild_links" />
</div>
<div class="left49">
<img scr="Bild_rechts" />
</div>
</div>

Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Hi
Schon la schönen Dank aber ich komme einfach immer noch nicht klar.
Es ist zum verzweifeln.
Nun habe ich im template wie vorgegeben folgendes eingefügt:
{* Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet "For template: Left menu + 1 column" *}
{lang}
{* End Header *}
Und im dazugehörigen Stylesheet folgendes:
div#header {
height: 80px; /* adjust according your image size */
background: #FF9933;
}
div.left49 {
float: left;
}
div#right49 {
float: right;
background: #FF9933;
position:absolute;
left:450px; top:350px; width:300px; height:150px;
}
Nun wenn du die Seite besuchst (www.otschuster.com)
Sind zwar rechts die Flaggen (aber viel zu weit oben) Keine Idee wie man die in die mitte bekommt.
Und dann das schlimmste und unverständlichste! Das Logo wird links überhaupt nicht mehr angezeigt.
Ich verzweifele ...
Kannst du mir weiterhelfen?
Schon la schönen Dank aber ich komme einfach immer noch nicht klar.
Es ist zum verzweifeln.
Nun habe ich im template wie vorgegeben folgendes eingefügt:
{* Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet "For template: Left menu + 1 column" *}
{lang}
{* End Header *}
Und im dazugehörigen Stylesheet folgendes:
div#header {
height: 80px; /* adjust according your image size */
background: #FF9933;
}
div.left49 {
float: left;
}
div#right49 {
float: right;
background: #FF9933;
position:absolute;
left:450px; top:350px; width:300px; height:150px;
}
Nun wenn du die Seite besuchst (www.otschuster.com)
Sind zwar rechts die Flaggen (aber viel zu weit oben) Keine Idee wie man die in die mitte bekommt.
Und dann das schlimmste und unverständlichste! Das Logo wird links überhaupt nicht mehr angezeigt.
Ich verzweifele ...

Kannst du mir weiterhelfen?
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Vergleich mal den Source, den ich dir gegeben habe mit dem den du eingegeben hastottyscom wrote: Das Logo wird links überhaupt nicht mehr angezeigt.

Der Parameter des img-Tags heisst src, nicht scr.
Außen- und Innenabstände lassen sich via CSS mit margin und padding einstellen. Und die Textpositionierung mit text-align ...Sind zwar rechts die Flaggen (aber viel zu weit oben) Keine Idee wie man die in die mitte bekommt.
Kleiner Tipp zum Schluss - die Entwicklung von Webseiten ist IMHO mit dem Firefox 2 am einfachsten. Dafür gibt es genügend Erweiterungen, die dir das Leben als Webdesigner um ein vielfaches erleichtern. Hier mal eine Aufstellung meiner WebDev-Plugin
- Clear Cache Button
- ColorZilla
- Html Validator
- Firebug
- FireFTP
- IETab
- MeasureIt
- Spiderzilla
- View Formatted Source
- View Source Chart
- Web Developer
- XRay
(Ja, ich weiß, in den Funktionen überschneiden sich die Plugins ein wenig)
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Hallo.
Falls es dir hilft:
http://www.goldner-stern.de
--> kopier dir einfach die benötigten Teile von code & css
@cyberman: ich benutze zusätzlich
- Live HTTP Headers
- Tamper Data
- IE Tab
- JSView
- Launchy
- LinkChecker
- SEOpen
hth,
Alex
Falls es dir hilft:
http://www.goldner-stern.de
--> kopier dir einfach die benötigten Teile von code & css
@cyberman: ich benutze zusätzlich
- Live HTTP Headers
- Tamper Data
- IE Tab
- JSView
- Launchy
- LinkChecker
- SEOpen
hth,
Alex
Last edited by faglork on Wed Nov 14, 2007 10:16 am, edited 1 time in total.
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Thx. Werd ich mir mal anschauen ...faglork wrote: @cyberman: ich benutze zusätzlich
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Ups,
Sorry das war ja wohl echt ein DFummer Fehler aber wenn verzweifelt dann vertauscht man schnell einen Buchstaben und das dumme ist man merkt es dann selbst gar nicht mal.
Ok Das Logo ist da nur jetzt komme nicht klar mit der entsprechenden position der fahnen. spiele da mit den margin und padding herum aber trotzdem bewegt sich da nix
Die Seite vom Kollegen ist ja echt Sehr stark. Wie komme ich an das template?
Das basis template mit left49 und sw wo ist das zu finden?
Sorry für meine Grünheit aber mit Euch kann man echt lernen Vielen dank für Euere zusammenarbeit. cmsmadesimple und die community ist echt empfehlenswert
Sorry das war ja wohl echt ein DFummer Fehler aber wenn verzweifelt dann vertauscht man schnell einen Buchstaben und das dumme ist man merkt es dann selbst gar nicht mal.
Ok Das Logo ist da nur jetzt komme nicht klar mit der entsprechenden position der fahnen. spiele da mit den margin und padding herum aber trotzdem bewegt sich da nix

Die Seite vom Kollegen ist ja echt Sehr stark. Wie komme ich an das template?
Das basis template mit left49 und sw wo ist das zu finden?
Sorry für meine Grünheit aber mit Euch kann man echt lernen Vielen dank für Euere zusammenarbeit. cmsmadesimple und die community ist echt empfehlenswert
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
"view source code"?ottyscom wrote: Wie komme ich an das template?
hth,
Alex
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Alles klar! Danke für all die wertvollen Tipps.
So nun noch eine kleine Unklarheit bei meiner pers. Homepage www.otschuster.com
Die gefällt nun mal ganz gut so. Aber ein Problem werde ich absolut NICHT los. Leider
Die Fahnen Rechts sind zu weit oben hingeklatscht und zu weit nach Rechts an den Rand geklebt. Ich weis dass man das mit CSS löst aber leider habe ich nach ewigen rumprobieren die Fahnen nicht zur Bewegung gebracht. Ich will sie ein kl. bisschen nach links und ungefähr in der Mitte statt ganz Oben.
Hier die Codes:
TEMPLATE:
{* Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet "For template: Left menu + 1 column" *}
{lang}
{* End Header *}
STYLESHEET:
div#header {
height: 80px; /* adjust according your image size */
background: #FF9933;
}
div#header left49 {
/* float: left; margin: 15px 0 18px 5px; */
float: left; margin: 5px 0 8px 5px;
}
div#right49 {
position:absolute;
left:450px; top:350px; width:300px; height:150px;
}
Wäre Euch über die Lösung des Problemas sehr Dankbar
Beste Grüsse aus Spanien
So nun noch eine kleine Unklarheit bei meiner pers. Homepage www.otschuster.com
Die gefällt nun mal ganz gut so. Aber ein Problem werde ich absolut NICHT los. Leider

Die Fahnen Rechts sind zu weit oben hingeklatscht und zu weit nach Rechts an den Rand geklebt. Ich weis dass man das mit CSS löst aber leider habe ich nach ewigen rumprobieren die Fahnen nicht zur Bewegung gebracht. Ich will sie ein kl. bisschen nach links und ungefähr in der Mitte statt ganz Oben.
Hier die Codes:
TEMPLATE:
{* Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet "For template: Left menu + 1 column" *}
{lang}
{* End Header *}
STYLESHEET:
div#header {
height: 80px; /* adjust according your image size */
background: #FF9933;
}
div#header left49 {
/* float: left; margin: 15px 0 18px 5px; */
float: left; margin: 5px 0 8px 5px;
}
div#right49 {
position:absolute;
left:450px; top:350px; width:300px; height:150px;
}
Wäre Euch über die Lösung des Problemas sehr Dankbar
Beste Grüsse aus Spanien
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
ottyscom wrote: meiner pers. Homepage www.otschuster.com



Not Found
The server encountered an internal error or misconfiguration and was unable to complete your request.
Please contact the server administrator, hostmaster@server.tld and inform them of the time the error occurred, and anything you might have done that may have caused the error.
More information about this error may be available in the server error log.
Additionally, a 500 Internal Server Error error was encountered while trying to use an ErrorDocument to handle the request.
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
So wird das nix. Eine chaotische Selektoren-Suppe. Bitte lerne die grundlegende Syntax von CSS, speziell was die Selektoren angeht:ottyscom wrote:
STYLESHEET:
div#header {
height: 80px; /* adjust according your image size */
background: #FF9933;
}
div#header left49 {
/* float: left; margin: 15px 0 18px 5px; */
float: left; margin: 5px 0 8px 5px;
}
div#right49 {
position:absolute;
left:450px; top:350px; width:300px; height:150px;
}
Wäre Euch über die Lösung des Problemas sehr Dankbar
http://jendryschik.de/wsdev/einfuehrung/css/selektoren
Generell: Du hast da wahllos irgendwelche Schnipsel zusammengebastelt, ohne zu wissen was du machst. Das wird nix.
Hab ich dir doch schon gesagt: Lies dich ein.
Hilft nix, da musst du durch.
Viele Grüße,
Alex
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Damit habe ich es auf deiner aktuellen Seite hinbekommenottyscom wrote: Ich will sie ein kl. bisschen nach links und ungefähr in der Mitte statt ganz Oben.
div.right49 {
padding-right: 1em;
padding-top: 2em;
}
was allerdings wieder Auswirkungen auf den "Top"-Link hat.
Aber wie Alex schon sagte, genau deshalb ist bei deiner CSS noch ein bißchen "Großreinemachen" + Lernen angesagt

Re: Ein zweites Bild oder Text rechts neben dem Header Logo
ach daher das Interesse an dem Code meiner Templates ...cyberman wrote: insbesondere vor dem Hintergrund, dass du WebDesign anbietest/anbieten möchtest ...
ROFLMAO,
Alex
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Das Interesse deines Templates lag nicht an den Grund um Webdesign usw anzubieten. Ich erstelle Webseiten schon seit einiger Zeit. Jahren! Aber ehrlich gesagt verwendete ich bisher nicht CSS. Aber anhand von Eueren Tipps und Beispielen bin ich derzeit dabei mich mit CSS verstärkt zu befassen. Habe mir auch schon Bücher befasst. Sobald ich das ganze etwas besser behersche werde ich künftig auch das CSS voll und ganz anwenden. MIT CMS Made Simple arbeite ich noch nicht so lange. daher hatte ich um Rat gesucht. Man sollte also deswegen nicht gleich wieder falsche Vermutungen aufstellen.
Aber wie ihr wohl seht ist es mir mittlerweile mit Eueren Tipps und zusätzlichen lernen die Fahenn korrekt zu plazieren auf www.otschuster.com
Also Danke und Sorry für evtl. Unangehmlichkeiten
Aber wie ihr wohl seht ist es mir mittlerweile mit Eueren Tipps und zusätzlichen lernen die Fahenn korrekt zu plazieren auf www.otschuster.com
Also Danke und Sorry für evtl. Unangehmlichkeiten
Re: Ein zweites Bild oder Text rechts neben dem Header Logo
Das solltest du schnellstmöglich ändern. Anstatt in jeder Seite einzeln rumzuändern, änderst du nur etwas im externen Stylesheet und schon ist die ganze Webseite geändert. Das bringt eine massive Zeitersparnis - kann ich dir nur wärmstens empfehlen.ottyscom wrote: Aber ehrlich gesagt verwendete ich bisher nicht CSS.
Dafür ist das Forum ja auch daMIT CMS Made Simple arbeite ich noch nicht so lange. daher hatte ich um Rat gesucht. Man sollte also deswegen nicht gleich wieder falsche Vermutungen aufstellen.
