Newsletter + css Formatierung
| Autor | Nachricht |
|---|---|
|
Verfasst am: 10. 03. 2010 [14:01]
|
|
|
id31
Themenersteller
Dabei seit: 07.11.2009
Beiträge: 30
|
Hallo Ich nutze für einen Newsletterversand die DirectMail/DirectMailSubscription Extension und habe für den Newsletter ein entsprechendes Template angelegt. Soweit so gut, der Versand funktioniert auch einwandfrei, die Inhalte und auch die Grafiken werden übergeben. Nur die css Formatierung funktioniert nicht...weil diese wohl wie ich mittlerweile in Erfahrung bringen konnte nicht im TypoScript des Templates eingebunden ist. Momentan schaut mein Template so aus... TYPOSCRIPT # spam protect e-mail addresses config.spamProtectEmailAddresses = 1 config.spamProtectEmailAddresses_atSubst = (at) # XHTML config.doctype = xhtml_trans config.xhtml_cleaning = all # cache period config.cache_period = 3600 # language config.htmlTag_langKey = de config.metaCharset = utf-8 config.language = de config.locale_all = de_DE page = PAGE page { typeNum = 0 bodyTag = stylesheet = fileadmin/templates/main/css/newsletter.css 10 = TEMPLATE 10.template = FILE 10.template.file = fileadmin/templates/main/newsletter.html 10.workOnSubpart = DOCUMENT_BODY 10.marks { TOP-MENU = HMENU TOP-MENU { special = directory special.value = 1 entryLevel = 0 #stdWrap.wrap = <ul>|</ul> 1 = TMENU 1 { noBlur = 1 expAll = 1 wrap = <ul>|</ul> NO.wrapItemAndSub = <li>|</li> NO.ATagTitle.field = abstract // description // title ACT = 1 ACT.wrapItemAndSub = <li class="act">|</li> ACT.ATagTitle.field = abstract // description // title } } HEADER-IMG = IMAGE HEADER-IMG { file = fileadmin/templates/main/img/img_header.jpg stdWrap.typolink.parameter = 9 alttext = TYPO3 Template free - Home } MIDDLE-MARKER = CONTENT MIDDLE-MARKER { table = tt_content select.orderBy = sorting select.where = colPos = 0 } } } Die newsletter.css ist ja hier noch extern eingebunden, nur weis ich nicht wie ich meine css innerhalb des TypoScript unterbringen soll? PHP body, html {
position: relative;
text-align: center;
border: 0;
margin: 0 auto;
padding: 0;
width: 100%;
height: 101%;
font: normal 100.01% Verdana, Arial, Helvetica, sans-serif;
background: #ffffff;
}
#outer-wrapper {
position: relative;
z-index: 0;
text-align: left;
margin: 0 auto;
height: auto;
background: #FFFFFF;
}
#content-wrapper {
position: absolute;
top: 204px;
left: 0;
width: 100%;
height: auto;
background: #FFFFFF;
clear: both;
}
#header, #outer-wrapper, #footer {
width: 756px;
}
#header-img {
width: 744px;
}
#middle-marker-box {
margin: 24px 12px 12px 24px;
padding: 0;
}
#middle {
float: left;
width: 100%px;
z-index: 2;
background: #FFFFFF;
}
#middle-content {
width: 100%px;
}
/*#right-marker-box {
margin: 24px 36px 12px 12px;
padding: 0;
}
#right-marker {
margin: 0;
padding: 0 12px;
background: #f1f1f1;
}
#right {
float: left;
width: 252px;
z-index: 4;
background: #FFFFFF;
}
#right-content {
width: 252px;
}*/
#header {
position: absolute;
left: 0;
top: 6px;
height: 162px;
background: #FFFFFF;
}
#header-img {
position: absolute;
left: 6px;
top: 6px;
height: 150px;
background: #FFFFFF;
}
#top {
position: absolute;
top: 168px;
left: 0;
width: 100%;
height: 20px;
background: #e5eef7;
}
H1, H2, H3, H4, H5, H6, P, UL { font-family: Verdana, Arial, Helvetica, sans-serif; color: #000000; }
A { color: #004078; text-decoration: none; }
A:hover { color: #004078; text-decoration: underline; }
P, UL, OL { font-size: 11px; }
P { margin: 0px 0px 0px 0px; }
H1 { font-size: 14px; color: #000000; }
H2 { font-size: 14px; color: #000000; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #004078; padding: 0 0 3px 0; }
H3 { font-size: 12px; color: #000000; }
H4 { font-size: 11px; color: #000000; }
H5 { font-size: 10px; color: #000000; }
H6 { font-size: 9px; color: #333333; font-weight: normal; }
H1, H2, H3, H4, H5, H6 { margin: 0px 0px 0px 0px; margin-top: 20px; }
H1 { margin: 0px 0px 0px 0px; margin-top: 20px; margin-bottom: 20px; }
H2, H3 { margin: 0px 0px 0px 0px; margin-top: 20px; margin-bottom: 10px; }
H4, H5, H6 { margin: 0px 0px 0px 0px; margin-top: 20px; margin-bottom: 10px; }
H1.csc-firstHeader, H2.csc-firstHeader { margin-top: 0px; }
H3.csc-firstHeader { margin-top: 0px; }
H4.csc-firstHeader, H5.csc-firstHeader, H6.csc-firstHeader { margin-top: 0px; }
P.bodytext { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; line-height: 14px; padding-bottom: 6px; text-align:justify; }
UL { list-style-type: disc; list-style-position: outside; }
UL UL LI { font-size: 10px; }
LI { padding-left: 2px; }
IMG { border-style: none; }
P.csc-caption { font-size: 10px; }
.csc-textpic-caption { font-family: Verdana, Arial, Helvetica, sans-serif; color: #000000; font-size: 10px; }
#footer {
position: relative;
left: 0;
height: auto;
clear: both;
background: #FFFFFF;
}
#footer-box {
position: relative;
margin: 0;
padding: 6px;
}
#footer-text {
margin: 0;
padding: 6px;
background: #FFFFFF;
text-align: center;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #E6E6E6;
font-size: 10px;
line-height: normal;
color: #002642;
}Wer kann mir da weiter helfen, ich habe bisher nirgendwo einen brauchbaren Ansatz finden können! |
|
Verfasst am: 10. 03. 2010 [19:26]
|
|
|
longhook
Dabei seit: 17.02.2006
Beiträge: 16
|
Hallo id31, eine Variante ist es zum Beispiel, die Stil-Angaben im Kopf der HTML-Datei mitzuliefern. Beispiel: TYPOSCRIPT page { headerData.10 = TEXT headerData.10.value ( <style type="text/css"> /* Hier deine Auszeichnungen in normaler CSS-Syntax */ </style> ) } Weil ich das Thema heute erst hatte und es mich einiges an Arbeit gekostet hat: Schau am besten noch vor der Fertigstellung deines HTML-Templates mal in dieses Thema rein ... Gruß longhook |



