Mehrere Probleme als TYPO3-Anfänger

timonyzer · #1 26.04.08, 15:09

Hallo liebe TYPO3-Community!
Auch ich habe nun endlich mal damit angefangen eine Seite mit Typo3 basteln zu wollen und hab mich dabei an dem Buch "Praxiswissen TYPO3" orientiert.
Leider habe ich momentan noch ein paar Probleme die ich nicht gelöst bekomme.

Hoffentlich könnt ihr mir helfen

Zunächst erstmal meinen bisherigen Code

Das CSS-File:

Zitat:

h2,h3,h4,h5,h6,div,p,body,html,input,button {
font: 14px Arial Fett;
}

.tx-newloginbox-pi1 table { border:0px solid #000000; width:20%; }

.tx-newloginbox-pi1 th { background:#000000; color:#ffffff; text-align:right; width:25%; }

.tx-newloginbox-pi1 td { background:#000000; color:#ffffff; }

.login input {
width: 50px;
height: 50px;
}

A:link {
color: ffffff;
}

A:vlink {
color: ffffff;
text-decoration: none;
}

A:visited {
color: ffffff;
text-decoration:none;
}

A:active {
color: ffffff;
text-decoration: none;
}

a:hover {
color:red;
text-decoration:none;
}

h1 {
font: bold 14px Arial Fett;
}

img.block {
display:block;
}

div, img {
margin:0;
padding:0;
border:0;
}

div#container {
width:1024px;
margin-left:auto;
margin-right:auto;
border:3px solid #ff0000;
background-color:#000000;
color:#ffffff;
font: 14px Arial Fett;
}

div#header {

background-color:black;
width:1024px;
color:white;
border-bottom:3px solid #ff0000;
}

div#top_left {
padding-top:5px;
padding-left:5px;
height:25px;
float:left;
text-align:left;
border-bottom:3px solid #ff0000;
}

div#top_right {
width:200px;
height:30px;
text-align:right;
border-bottom:3px solid #ff0000;
}

/*-----------------------------------*/

div#links {
clear:both;
float:left;
width:160px;
padding-top:37px;
padding-left:8px;
padding-bottom:10px;
}

div#head {
padding:5px;
font:25px Arial Fett;
}

div#center {
margin-left:166px;
width:685px;
border-left:3px solid #cc0000;
border-right:3px solid #cc0000;
padding:5px;
padding-top:20;
color:#ffffff;
font-color:#ffffff;

}

div#right {
width:155px;
height:div#links-height;
float:right;
text-align:left;
padding-top:10px;
padding-left:5px;
}

.float-left {
float:left;
}

div#footer {
clear:both;
text-align:right;
border-top: 3px solid #ff0000;

}

/*Styles der New Login Box*/

DIV.tx-newloginbox-pi1 {

background-color: black;
color: #ffffff;
font-family: Tahoma, Verdana, sans-serif;
font-size: 11px;
text-decoration: none;
margin-left: 1px;
}

DIV.tx-newloginbox-pi1 H3 {

/*Ausrichten der überschriften*/

background-color: transparent;
color: #ffffff;
font-family: Tahoma, Verdana, sans-serif;
font-size: 11px;
font-weight: bold;
text-decoration: none;
}

DIV.tx-newloginbox-pi1 TABLE {
margin-top:0px;
padding-top:0px;
width:100px;
margin-left: 0px;
}

DIV.tx-newloginbox-pi1 TR {
margin-top:0px;
padding-top:0px;
}

DIV.tx-newloginbox-pi1 TD {
margin-top:0px;
padding-top:0px;
}

DIV.tx-newloginbox-pi1 TABLE TR TD INPUT {
/*Für den Inhalt der Eingabefelder*/
height: 20px;
padding-right: 15px;
border-style: solid;
border-width: 1px;
border-color: #A2A2A2;
width:100px;
margin-left: 1px;
}

DIV.tx-newloginbox-pi1 p.tx-newloginbox-pi1-forgotP {
margin-top:0px;
margin-left: 1px;
/* Für den IE 6, aber auskommentiert für die Validierung*/
/*//margin-left: 3px;*/
padding-top:0px;
width:100px;
white-space: nowrap;
}

DIV.tx-newloginbox-pi1 p.tx-newloginbox-pi1-forgotP A {
margin-top:0px;
margin-left: 3px;
padding-top:0px;
width:100px;
color: #336699;
font-size: 10px;
font-weight: bold;
text-decoration: underline;
white-space: nowrap;
}

DIV.tx-newloginbox-pi1 p.tx-newloginbox-pi1-back {
margin-top:0px;
margin-left: 1px;
padding-top:0px;
width:100px;
}

DIV.tx-newloginbox-pi1 p.tx-newloginbox-pi1-back A {
margin-top:0px;
color: #336699;
margin-left: 0px;
padding:0px;
width:100px;
font-weight: bold;
text-decoration: underline;
font-size: 10px;
}

DIV.tx-newloginbox-pi1 p.tx-newloginbox-pi1-username {
margin-left: 0px;
margin-top:0px;
padding-top:0px;
/*width:100px;*/
display: block;
}

Das HTML-File:

Zitat:

<html>
<head>
<title>Homepage TV-Verl Badminton</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="language" content="de" />
<link rel="stylesheet" type="text/css" href="style.css" />

</head>
<body>



<div id="container">

<div id="header">
###LOGO###
</div>

<div id="top_left">
###KLICKPFAD###
</div>

<div id="top_right">
###LOGIN###
</div>

<div id="links">
<div>
###MENU_LINKS###
</div>

</div>

<div id="right">
###RECHTS###
</div>

<div id="center">
<div id="head">
###DISCLAIMER###
</div>
<div>
###INHALT###
</div>
</div>

<div id="footer">
###DRUCKVERSION### ###DATUM###
</div>

</div>



</body>
</html>

Mein TypoScript:

Zitat:

page = PAGE
page {
typeNum = 0
# Allgemeine Seiteneigenschaften setzen
bodyTag = <body bgcolor="#FFFFFF" topmargin="0" leftmargin="0">
meta.AUTHOR = Robert Meyer
meta.DESCRIPTION = Hier steht eine Beschreibung
stylesheet = fileadmin/style.css

# Die Designvorlage integrieren
10 = TEMPLATE
10.template = FILE
10.template.file = fileadmin/vorlage.html
10.workOnSubpart = DOKUMENT

10.marks {

# Datum einbinden
DATUM = TEXT
DATUM.data = date : d.m.y H:i:s

# Logo einbinden
LOGO = IMAGE
LOGO.file = fileadmin/images/banner2.jpg

# Menü
MENU_LINKS = HMENU
MENU_LINKS {
special = directory
special.value = 1
1 = GMENU
1.NO = 1
1.NO {
XY = 150, 24
backColor = #000000

# Menütext
10 = TEXT
10.text.field = title
10.fontColor = #FFFFFF
10.fontFile = fileadmin/fonts/Arial.ttf
10.fontSize = 16
10.niceText = 0
10.offset = 7, 16
}

# RollOver
1.RO <.1.NO
1.RO.backColor = #ff0000

# Zweite Ebenesel
2 < .1
2.NO {
xy = 100, 24

10.fontSize = 14
10.fontFile = fileadmin/fonts/Arialk.ttf
10.offset = 30,16
}

2.RO < .2.NO
2.RO.backColor = #ff0000

}

# Seitentiel
DISCLAIMER = TEXT
DISCLAIMER.text.field = title // subtitle

KLICKPFAD = COA
KLICKPFAD {
# Der vorgeschaltete Text
10 = TEXT
10.value = Sie befinden sich hier: 

# Den Klickpfad an Position 20 darstellen
20 = HMENU
20 {
special = rootline
special.range = 0|-1
1 = TMENU
1.NO = 1
1.NO.linkWrap = | / 
}

}

# Inhalt ausgeben
INHALT = CONTENT
INHALT {
table = tt_content
select.orderBy = sorting
select.where = colPos = 0
}

# Rechten Inhalt ausgeben
RECHTS = CONTENT
RECHTS {
table = tt_content
select.orderBy = sorting
select.where = colPos = 2
}

# Login einbinden
LOGIN < plugin.tx_newloginbox_pi1

}

}

config.compensateFieldWidth = .5
config.compensateFieldHeight = 20

tt_content.login.20.layout = <td class="csc-form-labelcell">###LABEL###</td><td class="csc-form-fieldcell">###FIELD###</td>
page.10.marks.LOGIN.20.layout = <td class="csc-form-labelcell">###LABEL###</td><td class="csc-form-fieldcell">###FIELD###</td>

Nun meine Probleme:

1. Wie man sich das HTML anschaut sieht man, dass der Marker ###LOGIN### schön rechtsbündig angezeigt wird, wenn ich nun aber newloginbox darauf legen möchte wie mit

Zitat:

# Login einbinden
LOGIN < plugin.tx_newloginbox_pi1

geschehen, dann zerschießt es mir das ganze Template und sieht folgendermaßen aus:

Das ganze sollte aber wenn möglich in der Zeile eher folgendermaßen aussehen:

2. Das Login funktioniert nicht! Ich habe zwar einen Ordner angelegt in dem die User drinstehen, aber anscheinend findet newloginbox die nicht richtig. Ist da im TypoScript was falsch?

3. Wenn ich auf den Seiten normale Inhalte als Text erstelle werden diese normal angezeigt, möchte ich aber z.b. Tabelle inbinden, so werden diese nur in schwarzer Schriftfarbe angezeigt, auch wenn ich dies beim erstellen der Tabelle auf weiß umstelle.

Ich hoffe ihr könnt mir helfen, ich sitz hier nun schon seit einer Woche dran und komm trotz intensiver Online-Recherche nicht richtig weiter :sad:

Vielen Dank im Vorraus!

Mfg

Timonyzer

Space-Teddy · #2 26.04.08, 15:53

zu 1.
die loginbox hat ein eigenes template
typo3.org: Documentation: New front end login box(Table of Contents)

zu 2.
die seite auf der die loginbox eingebunden ist auf erweitet stellen
und bei Allgemeine Datensatzsammlung den sysordner für die user angeben

zu 3.
auch tabellen lassen sich über typoscript anpassen
siehe typoscript objectbrowser
tt_content.table

timonyzer · #3 26.04.08, 16:36

Ersteinmal Danke für die schnelle Antwort

Das mit dem Sysordner hat direkt geklappt, super!

Das die newloginbox ein eigenes template hat wusste ich auch, nur war ich aus der Dokumentation nicht viel schlauer geworden und beim betrachten der newloginbox_00.html hat sich mir nicht erschlossen wie ich da die das login anpassen könnte.

Außerdem stellt sich mir die Frage wie es kommt, dass er das Login auf der linken Seite aufbaut, obwohl der Marker eigentlich rechts stand

Leider hat mir der Hinweise mit dem tt_content.table auch nicht viel gebracht, denn an entsprechender Stelle fand ich nur folgendes vor:

color ist ja aber nur die Hintergrund und nicht die Schriftfarbe und weitere Versuche, wie z.b.
tt_content.table.20.fontColor = #ffffff
haben auch nicht funktioniert...

Mfg

Timonyzer

Space-Teddy · #4 27.04.08, 12:22

also das ist jetzt extrem rustikales css
aber du kannst die farben der tabelle ja auch über css steuern

Code:

td {
   color:black;
   background-color:white;
}

dabei änderst du allerdings sämtliche zellen auf der webseite

du könntest auch dem p bei innerStdWrap.wrap ein classe geben und die klasse ansprechen
um die farbe zu ändern

bei der Login box brauchst du doch nur da im template die <tr> tags zu entfernen um es in eine Zeile zu bekommen
ab Zeile 73 <a name="template_login"></a><h1>TEMPLATE_LOGIN</h1>
abwärts müsste dein Bereich für den Login sein

beachte das die login box mit sicherheit auch ein eigenen div wrap hat setzt
(<div class="tx-newloginbox-pi1">)

vergleich doch den ausgabe quelltext mit dem tempalte
das sollten dir Ähnlichkeiten auffallen
und eigentlich genug anhaltspunkte geben sie anzupasssen

timonyzer · #5 27.04.08, 16:53

Super, das hat mich wieder um einiges weitergebracht!

Die Einbettung des Logins ist nun fast perfekt, ich verwende sogar zwei verschiedene Templates für das statische und individuelle Login *stolzsei*

Das mit der Tabelle hat auch reibungslos geklappt

Mein einziges Problem ist nun, dass er das statische Login nicht richtig rechtsbündig setzt und den roten Strich darunter nicht setzt...

Vielleicht liegt der Fehler ja im CSS? Hier ist der Quellcode der den gesamten kleinen Kasten erstellt

Zitat:

div#header {

background-color:black;
width:1024px;
color:white;
border-bottom:3px solid #ff0000;
}

div#top_left {
padding-top:5px;
padding-left:5px;
height:25px;
float:left;
text-align:left;
border-bottom:3px solid #ff0000;
}

div#top_right {
width:200px;
height:30px;
text-align:right;
border-bottom:3px solid #ff0000;
}

Und so sieht es nun aus, wobei ich es super fände ne Möglichkeit zu haben, diesen roten Unterstrich zu haben und das ganze Login rechtsbündig.

Nochmals Danke für die bisherige Hilfe, vielleicht bekommt ihr das ja auch noch nich *hoff*

Mfg

Timonyzer

Space-Teddy · #6 27.04.08, 20:03

vieleicht hilft dir ja float (right)

SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

timonyzer · #7 27.04.08, 23:05

Das habe ich ja schon benutzt, wie du hier sehen kannst

Zitat:

div#top_left {
padding-top:5px;
padding-left:5px;
height:25px;
float:left;
text-align:left;
border-bottom:3px solid #ff0000;
}

div#top_right {
width:200px;
height:30px;
text-align:right;
border-bottom:3px solid #ff0000;
}

top_left ist der Klickpfad, der linksbündig dargestellt werden soll und top_right, das Login, das nach rechts soll.

Ich habe nun schon alles mögliche probiert mit float und position aber ich komme auf keinen "grünen Zweig", da es mir entweder das template komplett zerschießt, so aussieht wie in meinem vorigen post beschrieben oder er stellt die beiden divs in 2 verschiedene Zeilen.

Gibts da wirklich keine Lösung für???

Mir fällt übrigens gerade noch auf, dass die roten Begrenzungen links und rechts neben dem Inhalt in der Mitte nicht bis ganz nach unten gehen, sondern nur so lang sind wie der momentane Inhalt.
Kann man das irgendwie machen, dass der div#center immer automatisch so lang wird, dass es bis nach unten passt?

Hoffe ich nerve nicht

Mfg

Timonyzer

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht	Thema bewerten
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln	Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Anfänger Probleme mit rggooglemap	Neobase	rg	9	20.05.08 23:27
TYPO3 - Pre-Anfänger!	SebSey	TYPO3 4.x Fragen und Probleme	4	27.06.07 15:28
Typo3 für Anfänger...	Planloser	Forum Bar	9	09.12.06 12:21
Typo3 Anfänger Hilfe	votecer	TYPO3 4.x Backend	1	23.09.06 16:39
RealURL 0.2.0 mit Typo3 3.7: Mehrere Domains = Probleme	GK_Over	Suchmaschinenfreundliche URLs (SEO)	0	17.01.05 15:31

Suche

Userpanel

Mehrere Probleme als TYPO3-Anfänger

Danke!^^