[GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

Dancer62 · 08. November 2013 12:52

Moin,

bevor ich hier meine Fragen poste, möchte ich mich kurz vorstellen:

Ich bin ein etwas "älteres Semester", das vor rund 25 Jahren Nachrichtentechnik / Informatik an einer FH studiert hat. Mittlerweile arbeite ich immer noch mit Computern und Software - privat und beruflich. Dennoch bin ich in Sachen Websiten-Erstellung ein absoluter Neuling und ohne jede Erfahrung - verzeiht mir deshalb meine Naivität in einigen Fragen.

Da ich zum ersten Mal hier im Forum poste, habe ich zwar versucht eine Antwort auf meine Fragen (s.u.) zu finden, bin aber leider nicht fündig geworden. Sollte sich die Antwort trotzdem irgendwo versteckt haben, bitte ich meinen Post dorthin zu verschieben.

Nun zu meinem eigentlichen Problem:
Von unserer Freiwilligen Feuerwehr wurde ich auserkoren, eine Website ins Leben zu rufen, auf der wir uns dann entsprechend präsentieren wollen. Nach langem Durchforsten des Internets und Durchlesen diverser Beiträge bin ich letztlich bei CMS Made Simple "hängengeblieben", weil es mir für unsere Zwecke am geeignetsten erschien. Auch habe ich in Zusammenarbeit mit den Verantwortlichen (denjenigen, die alles bezahlen sollen) ein Template gefunden, das unseren Ansprüchen nach Aussehen, Aufbau und Struktur entspricht (siehe hier). Bevor dieses Template jedoch gekauft (und ggfs. angepasst) werden soll, sind meine hauptsächlichen Fragen :

Kann ich derartige Templates überhaupt in CMSMS importieren und be-/verarbeiten bzw. was muss ich grundsätzlich beim Erwerb von fertigen Templates beachten ?
Es gibt ja auch Templates für weitere CM-Systeme (z.B. Joomla!, Drupal, WordPress). Welche davon eignen sich für den Import in CMSMS- falls überhaupt - am besten (Stichwort : Nachbearbeitung) ?

Vielen Dank schon mal für Eure Bemühungen,

Dancer62

nicmare · 08. November 2013 13:47

Vielen Dank für deine Vorstellung. Man merkt du bist einer von der alten Schule. Herzlich Willkommen also!
Du musst dir CMSms wie ein Baukasten (Framework) vorstellen. Du kannst JEDES Template kaufen und einrichten. Du darfst es dir aber nicht wie eine "Ein-Klick-Lösung" vorstellen. Du musst den Quelltext von gekauften Template bei CMSms einfügen und dann an den entsprechenden Stellen Platzhalter einfügen. Die wichtigsten wären da:
{title}, {menu} und {content}.
Also im Template wo das Menü geschrieben ist, muss es durch {menu} ersetzt werden. Und beim Inhalt eben durch {content}.
Der Menüplatzhalter verwendet dann seinen eigenen Quelltext. Die Ausgabe wird vermutlich nicht sofort passen. Aber das lässt sich glücklicherweise auch anpassen. Dabei können wir dir helfen.
Also erstmal ein Schritt nach dem anderen ;-)

NaN · 08. November 2013 14:04

Hallo und willkommen im Forum.

Vielelicht hilft Dir ja dieses Thema schon weiter:
http://www.cmsmadesimple.de/forum/viewtopic.php?id=1425

Grundsätzlich kannst Du jedes Template in CMSms "importieren". Man spricht dabei aber eher von "portieren", denn die Importfunktion des ThemeManagers funktioniert nur bei XML-Paketen, die explizit für CMSms erstellt wurden. Es gibt also kein Button mit dem man fremde Templates (Joomla, Drupal oder WordPress) einfach per Knopfdruck importieren kann.

Themes bestehen i.d.R. aus ein oder mehreren HTML-Dateien, CSS-Dateien (Stylesheets) und eventuell Bildern und Javascript-Dateien.

Bei CMSms ist es ähnlich, nur dass nicht für alles Dateien benötigt werden (HTML und Stylesheets z.B.). Der Inhalt der Dateien wird stattdessen in der Datenbank gespeichert. Dadurch können diese Teile bequem vom CMS aus verwaltet und bearbeitet werden.

Ein Theme bei CMSms besteht also aus ein oder mehreren Datenbank-Templates, Datenbank-Stylesheets und den restlichen Dateien (Bilder, Javascript).

Styleheets ist bei CMSms stinknormaler CSS-Code. Der kann über das CMS verwaltet werden, muss aber nicht. Man kann die Stylesheets auch als Datei auf dem Server ablegen und vom Template aus direkt darauf verlinken.

Templates bestehen aus einfachem HTML und Smarty-Code.

Mit dem HTML-Code strukturierst Du den groben Aufbau Deiner Seite. Also bestimmte Bereiche wie z.B. Kopf, linke Spalte, rechte Spalte, Fuß, Menü (ohne das Menü selbst - nur der Bereich dazu wo es am ende hin soll) etc. Das Aussehen dieser Bereiche wird über die Stylesheets formatiert. Die Inhalte in diesen Bereichen werden mit dem Smarty-Code generiert.

Der Smarty-Code besteht im Prinzip aus Platzhaltern oder auch einfachen logischen Bedingungen (if, else usw.), die dann den eigentlichen Inhalt in den Bereichen des Templates anzeigen. Inhalte können sein, Menü, News-Einträge, Text etc.

Als erstes erstellst Du Dir im "uploads"-Ordner ein Verzeichnis für Dein Theme. (z.B. "/uploads/themes/name_des_themes/").
Dorthin kopierst Du alles, was zum Theme gehört.

Den HTML-Code des Themes fügst Du in CMSms als neues Template ein. (Menü: Layout->Termplates)
Alles was Inhalt ist, nimmst Du aus dem Template raus. (auch das Menü) An den Stellen an denen Inhalte sollen, kommt der Smarty-Code (z.B. {content} für Inhalte, {menu} für das Menü, {news} für News usw.)

Im Head des Templates musst Du die Pfade zu den Stylesheets/Javascript-Dateien anpassen (z.B. "{root_url}/uploads/themes/name_des_themes/...").

Das sollte eigentlich schon alles sein. Die Detail-Fragen zum Anpassen des Layouts kommen dann bestimmt später wink

Ich empfehle Dir einfach mal an einem kostenlosen Template das Portieren auszuprobieren, bevor Du da jetzt Geld für etwas ausgibst, bei dem Du noch nicht weißt, ob und wie es am Ende funktioniert.

Dancer62 · 08. November 2013 14:06

Hallo nicmare,

Danke für Deine schnelle Antwort. Sie entlastet mich natürlich enorm, da ich jetzt die Gewissheit habe, dass ich tatsächlich alle gewünschten Templates (mit etwas Nacharbeit) verwenden kann.
Ich bin mir ziemlich sicher, dass ich hier im Forum noch das eine oder andere Mal Fragen stellen werde - und vielleicht irgendwann auch soweit bin, selber Antworten geben zu können.

Mit freundlichen Grüßen,

Dancer62

Dancer62 · 08. November 2013 14:09

Hallo NaN,

Danke auch Dir für Deine schnelle Hilfe. Sie kommt ja schon fast einer kurzen Einführung in die Programmierung und Gestaltung einer Website unter CMSms gleich. Aber ich hoffe mal, dass es mir entsprechend auch hilft.

Sobald ich weitere Fragen habe (oder auch bereits etwas vorweisen kann), werde ich mich wieder melden.

Mit freundlichen Grüßen,

Dancer62

Andynium · 10. November 2013 19:27

Hier findest du ein etwas älteres Video-Tutorial, was dir ungefähr eine Vorstellung von den notwendigen Anpassungen vermittelt.

http://www.cmsmadesimple.org/uploads/me … chocolate/

Und hier noch ein Tutorial in Textform:

http://www.cmsmadesimple.de/uploads/fil … Simple.pdf

Dancer62 · 10. Mai 2014 22:32

Hallo,

ich habe jetzt mit meinem Provider (fast) alles geklärt, CMSms installiert und ein passendes Theme gefunden. Dieses möchte ich jetzt nach CMSms portieren, was - dank NaN's ausführlicher Erläuterung bisher ganz gut klappt. Bei der Anpassung des Codes (d.h. alter HTML-Code raus, Smarty-Code rein) habe ich beim Versuch, dies alles abzuspeichern, die Fehlermeldung "Duplicate content block: content_en" bekommen sad .
Mit der kann ich leider nicht direkt etwas anfangen. Ich habe allerdings mehrere {content}-Tags in meinem Code, die ich nicht weiter unterschieden habe (geht das überhaupt ??), da ich mehrere, unterschiedliche Bereiche habe, in die Text / Bilder hinein sollen.

Im Moment bin ich allerdings etwas überfragt, wie ich diesen Fehler beheben kann. Vielleicht kann mir jemand von Euch dabei helfen ??

Vielen Dank schon mal für Eure Bemühungen,

Dancer62

nockenfell · 10. Mai 2014 23:19

Wenn du mehrere Inhaltsblöcke haben willst, musst du diese auch entsprechend benennen:

Hier klicken, um den Code zum Kopieren zu markieren

{content} <- Standard-Inhaltsblock 'content_en' 
{content block='zweiterInhalt'}  <- weitere Inhaltsblock
{content block='dritterInhalt'}  <- weitere Inhaltsblock
{content block='vierterInhalt'}  <- weitere Inhaltsblock

Die Namen sind natürlich frei wählbar.

Dancer62 · 10. Mai 2014 11:06

Danke Nockenfell,

das ist natürlich super smile . Genauso so eine Antwort habe ich gesucht !! Ich hoffe, das sich dieses Problem damit erst einmal gelöst hat (bis zum nächsten dann...).

Mit freundlichen Grüßen,

Dancer62

Dancer62 · 18. Mai 2014 21:38

So, nun habe ich das Template erfolgreich mitsamt den notwendigen CSS-Dateien "importiert" und die Styles an das Template gebunden, da stosse ich gerade auf die nächste Hürde: beim Versuch, die eingebetteten Bilder (die ich vorher in einen neu angelegten Ordner hochgeladen habe) darzustellen, passiert - gar nichts sad .
Offensichtlich muss ich CMSms noch mitteilen, wo sich die Bilder befinden (sie werden in einer der CSS-Dateien aufgerufen) - aber wie ?
Und wenn ich JavaScript einbinden muss, wie geschieht das (ich habe mehrere .js-Dateien, die im ursprünglichen Template aufgerufen werden - brauche ich die noch ?) ?

Ich hoffe nicht, dass ich mit meinen Fragen allzu viel Chaos erzeugt habe roll , aber leider sind meine Kenntnisse bzgl. CMSms noch sehr rudimentär.

Viele Grüße,

Dancer62

nockenfell · 19. Mai 2014 04:48

Verwendest du die CMSMS eigene Funktion für Stylesheets? Wenn ja, musst in der CSS Datei absolute Pfade verwenden:

Hier klicken, um den Code zum Kopieren zu markieren

.bild {
  background: url([[root_url]]/pfad/zum/bild.jpg);
}

Ob du die Javascripts noch brauchst, kann ich schlecht beurteilen, ohne dieses zu kennen. Das Javascript kann allenfalls das Menü animieren, eine Lightbox ermöglichen oder im Layout Anzeigen steuern.

Dancer62 · 21. Mai 2014 21:11

Blöde Frage, ich weiß, aber muss ich "[[root_url]]" tatsächlich so schreiben oder ist das ein Platzhalter ? Falls letzteres zutrifft, welchen Wert muss ich dort eintragen bzw. woher bekomme ich ihn ?

Was ist die

nockenfell schrieb:

...CMSMS eigene Funktion für Stysheets...

und woran erkenne ich sie bzw. wie kann ich sie einsetzen und welche Vorteile bietet sie mir gegenüber der anderen (welcher ?) Funktion ?

Ich seh' schon, ich muss noch viel lernen... yikes

Schönen Abend noch,

Dancer62

NaN · 22. Mai 2014 08:00

Was ist die CMSMS eigene Funktion für Stysheets

Das ist das Plugin {cms_stylesheets}, welches im <head> Bereich Deines Templates platziert wird, um die Stylesheets zu laden - sofern Du sie über die Datenbank verwaltest. Anderenfalls stehen im <head>-Bereich Deines Templates die direkten Links zu Deinen Stylesheets auf dem Server.

Das Plugin hat den Vorteil, dass es mehrere Stylesheets nach Ausgabemedium gruppiert, zusammenfasst und minimiert (entfernen von unnötigen Leerzeichen/-zeilen). Dadurch werden weniger Anfragen an den Server gesendet und die Antwort des Servers fällt etwas geringer aus.

Der Nachteil ist, dass die Datenbank-Stylesheets im Verzeichnis /tmp/cache/ zwischengespeichert werden. Dadurch stimmen relative Links zu Bildern im Stylesheet nicht mehr (z.B. background: url(../img/bild.jpg);), weil jetzt relativ zum zwischengespeicherten CSS-Datei gesucht wird. Und dort gibt es diese Bilder nicht.

Deshalb musst Du in diesem Fall die Pfade zu Bildern im Stylesheet so anpassen, dass dort der absolute Pfad bzw. die absolute URL steht unter dem die Bilder tatsächlich auch zu finden sind.

muss ich "[[root_url]]" tatsächlich so schreiben

Ja.
[[root_url]] ist ein Smarty-Plugin welches an dieser Stelle dann automatisch die URL Deiner Webeite einsetzt, sodass eine korrekte absolute URL zu den Bildern entsteht. Normalerweise (wie z.B. in Templates) werden für solche Plugins geschweifte Klammern verwendet ( {root_url} ), aber da diese auch zum regulären CSS-Code gehören (ebenso wie eckige oder normale Klammern), verwendet man in diesem Falle doppelte eckige Klammern, um Plugins vom CSS-Code zu unterscheiden.

Beispiel:

Deine Bilder seien mal im Verzeichnis "/uploads/themes/name_des_themes/img/".
Die Stylesheets im Verzeichnis "/uploads/themes/name_des_themes/css/".
In den CSS-Dateien steht für Bilder "background: url(../img/bild.jpg);".

Wenn Du im Template direkt auf diese CSS-Dateien verlinkst:

Hier klicken, um den Code zum Kopieren zu markieren

<link rel="stylesheet" type="text/css" href="deine_Webseite/uploads/themes/name_des_themes/css/stylesheet.css" />

Dann sucht der Browser die Bilder relativ zur CSS-Datei. Das heißt "../img/bild.jpg" bedeutet für den Browser "deine_Webseite/uploads/themes/name_des_themes/img/bild.jpg".
Alles palletti.

Wenn Du die Stylesheets aber in die Datenbank kopiert, mit dem Seitentemplate verknüpft und das {cms_stylesheet} Plugin im Template verwendet hast, dann steht im HTML Code im Browser an dieser Stelle:

Hier klicken, um den Code zum Kopieren zu markieren

<link rel="stylesheet" type="text/css" href="deine_Webseite/tmp/cache/kryptischer_name.css" />

Und das wiederum bedeutet für den Browser, dass Bilder mit "../img/bild.jpg" relativ zur zwischengespeicherten Datei gesucht werden. Also sucht er nach "deine_Webseite/tmp/img/bild.jpg".
Keine Bilder zu sehen -> Stylesheets in der Datenbank anpassen und die Bilder so verlinken:

Hier klicken, um den Code zum Kopieren zu markieren

background: url([[root_url]]/uploads/themes/name_des_themes/img/bild.jpg);

Dancer62 · 11. Juni 2014 20:08

Irgendwie komme ich immer noch nicht weiter. Ich würde gerne den Code des Templates und der Stylesheets hier posten, damit Ihr Euch ein Bild machen könnt, weiß aber leider nicht, wie ich den Code so schön wie oben hineinbekomme cry .

Vielleicht könnt Ihr mir ja noch einmal helfen...

Vielen Dank erstmal,

Dancer62

Andynium · 11. Juni 2014 20:36

Ist ganz einfach - du fügst den Template Inhalt bzw die CSS hier ein, markierst den jeweiligen Abschnitt und klickst in der Toolbar, die dir eigentlich angezeigt werden sollte (falls nicht, Javascript für diese Seite zulassen / aktivieren), das Symbol rechts neben der Sprechblase. Sieht aus wie eine stilisierte DOS Konsole.

Alternativ kannst du vor bzw nach dem jeweiligen Code block (code) bzw (/code) einfügen - aber die runden Klammern durch eckige ersetzen wink .

Dancer62 · 11. Juni 2014 21:00

Okay und danke - hier nun mein Template (ich weiß, einiges ist noch unschön, aber das wird nach und nach angepasst)...

Hier klicken, um den Code zum Kopieren zu markieren

{process_pagedata}
<!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" xml:lang="de" >
<head>
<title>{sitename} - {title}</title>

{cms_stylesheets}
<link rel="stylesheet" href="css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all">

</head>
<body id="page1">
<div class="tail-top">
   <div class="header-bg">
      <div class="header-splash">
         <div class="cont-splash">
            <div class="tail-bottom">
               <div id="main">
                  <!-- header -->
                  <header>
                     <div class="bg-top"></div>
                     <h1><a href="index.html">fire departments</a></h1>
                     <form action="" id="search-form">
                        <fieldset>
                           <strong>
                           <input type="text">
                           </strong><a href="#" onClick="document.getElementById('search-form').submit()">SUCHE</a>
                        </fieldset>
                     </form>
                     <nav>
{cms_module module="menumanager"}
                     </nav>
                     <div id="slogan"><img src="images/slogan.png"></div>
                  </header>
                  <div class="container">
                     <!-- aside -->
                     <aside>
                        <div class="inside">
{cms_module module="news"}
                        </div>
                     </aside>
                     <!-- content -->
                     <section id="content">
                        <div class="wrapper indent">
                           <article class="col-1">
{content}
                              <a href="#" class="link1">Mehr lesen</a>
                           </article>
                           <article class="col-2">
{content block='Spalte_rechts'}
                              <a href="#" class="link1 extra">Mehr lesen</a>
                           </article>
                        </div>
{content block='Block_unten'}
                        <a href="#" class="link1">Mehr lesen</a>
                     </section>
                     <div class="clear"></div>
                  </div>
                  <!-- footer -->
                  <footer>
                     <div class="inside">
{cms_module module="menumanager"}
                        Freiwillige Feuerwehr Bockhorn  © 2014    <a href="index-7.html">Privacy Policy</a><br>
                        <!--FOOTER_LINK-->
                     </div>
                  </footer>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>

...und hier zwei meiner Stylesheets, die in der Datenbank als "Feuerwehr_style" und "Feuerwehr_reset" benannt sind:

Hier klicken, um den Code zum Kopieren zu markieren

/* Getting the new tags to behave */
article, aside, audio,
canvas, command,
datalist, details,
embed,
figcaption, figure, footer,
header, hgroup,
keygen,
meter,
nav,
output,
progress,
section, source,
video {
     display:block;
}
mark,
rp, rt, ruby,
summary,
time {
     display:inline;
}

/* Global properties ======================================================== */
body {
     background:#222222;
     font-family:Arial, Helvetica, sans-serif;
     font-size:100%;
     line-height:1em;
     color:#a3a2a2;
     min-width:980px;
}
html {
     min-width:980px;
}
html,
body {
     height:100%;
}



/* Global Structure ============================================================= */
#main {
     margin:0 auto;
     position:relative;
     width:980px;
     font-size:.75em;
}

     /* Header */
     header{
          height:654px;
          position:relative;
     }

     /* Content */
     section#content {
          float:left;
          width:675px;
          padding-top:44px;
     }

     /* Sidebar */
     aside {
          width:262px;
          float:left;
          margin:-96px 43px 0 0;
          position:relative;
          color:#fff;
          background:url([[root_url]]/uploads/themes/firefighter/images/bg-tail.gif) repeat-x left top #780217;
     }

     /* Footer */
     footer {
          font-size:.92em;
          height:102px;
          text-transform:uppercase;
     }




/* Left & Right alignment */

.fleft {
     float:left;
}
.fright {
     float:right;
}
.clear {
     clear:both;
}

.col-1,
.col-2,
.col-3 {
     float:left;
}

.alignright {
     text-align:right;
}
.aligncenter {
     text-align:center;
}

.wrapper {
     width:100%;
     overflow:hidden;
}

.container {
     width:100%;
     padding-bottom:38px;
}


/*---- tailings ----*/
.header-bg {
     background:url([[root_url]]/uploads/themes/firefighter/images/header-bg.jpg) no-repeat center 172px;
}
.header-splash {
     background:url([[root_url]]/uploads/themes/firefighter/images/header-splash.jpg) no-repeat center top
}
.cont-splash {
     background:url([[root_url]]/uploads/themes/firefighter/images/cont-splash.gif) no-repeat center 654px;
}
.tail-top {
     background:url([[root_url]]/uploads/themes/firefighter/images/tail-top.gif) repeat-x left top #161515;
}
.tail-bottom {
     background:url([[root_url]]/uploads/themes/firefighter/images/tail-bottom.gif) left bottom repeat-x;
}

/*----- form defaults -----*/
input,
select,
textarea {
     font-family:Arial, Helvetica, sans-serif;
     font-size:1em;
     vertical-align:middle;
     font-weight:normal;
}

fieldset {
     border:0;
}


/*----- lists -----*/

.news {
     width:100%;
     overflow:hidden;
}
.news li {
     width:100%;
     overflow:hidden;
     vertical-align:top;
     padding-bottom:20px;
     margin-bottom:22px;
     background:url([[root_url]]/uploads/themes/firefighter/images/line-hor.png) repeat-x left bottom;
}
     .news li a {
          text-decoration:none;
     }
          .news li strong {
               text-transform:uppercase;
               color:#fff;
               display:block;
               font-size:1.08em;
               background-color:#f09b0b;
               padding:6px 0 6px 11px;
          }
          .news li a {
               color:#fff;
               text-decoration:none;
               font-weight:bold;
               line-height:1.667em;
               display:block;
               padding-top:8px;
          }
          .news li a:hover {
               color:#000;
          }
               .news li a img {
                    position:relative;
                    top:5px;
               }

.list {
     padding-bottom:20px;
}
     .list li {
          padding:0 0 4px 11px;
          background-repeat:no-repeat;
          background-position:0 3px;
          background-image:url([[root_url]]/uploads/themes/firefighter/images/marker1.gif);
     }
     .list.extra li {
          background-image:url([[root_url]]/uploads/themes/firefighter/images/marker2.gif);
     }
               .list li a {
                    text-transform:uppercase;
                    color:#faac09;
                    text-decoration:none;
                    font-weight:bold;
                    font-size:1.08em;
               }
               .list.extra li a {
                    color:#c20526;
               }
               .list li a:hover {
                    color:#fff;
               }

.list1 {
     width:100%;
     overflow:hidden;
}
     .list1 li {
          float:left;
          width:206px;
          line-height:1.667em;
          margin-right:28px;
          padding-bottom:30px;
     }
     .list1 li.alt {
          margin-right:0;
     }
     .list1 li h5 {
          padding-top:16px;
     }
     .list1 li a {
          font-size:1.08em;
          color:#faac09;
     }

.list2 {
     width:100%;
     overflow:hidden;
}
     .list2 li {
          float:left;
          width:159px;
          margin-right:13px;
     }
     .list2 li.last {
          margin-right:0;
     }
          .list2 li span {
               display:block;
               padding-top:22px;
          }

/*----- other -----*/
.img-indent {
     margin:0 20px 0 0;
     float:left;
}
.img-indent1 {
     margin-bottom:20px;
}

.img-box {
     width:100%;
     overflow:hidden;
     padding-bottom:23px;
     line-height:1.667em;
}
     .img-box img {
          float:left;
          margin:0 31px 0 0;
     }

.extra-wrap {
     overflow:hidden;
}

p {
     margin-bottom:20px;
     line-height:1.667em;
}
.p0 {
     margin:0;
     padding:0;
}

dl {
     line-height:1.667em;
}
     dl dt {
          color:#faac09;
     font-size:1.08em;
     font-weight:bold;
     line-height:1.5em;
     text-transform:uppercase;
}
     dl dd {
          padding-bottom:20px;
     }
     dl dd.last {
          padding:0;
     }

     .address dd span {
          float:left;
          width:91px;
     }



/*----- txt, links, lines, titles -----*/
a {
     color:#a3a2a2;
     outline:none;
}
a:hover {
     text-decoration:none;
}

h1 {
     position:absolute;
     left:-3px;
     top:9px;
     text-indent:-9999px;
}
     h1 a {
          float:left;
          width:480px;
          height:76px;
          background:url([[root_url]]/uploads/themes/firefighter/images/logo.gif) no-repeat left top;
     }
h2 {
     font-size:24px;
     line-height:1.2em;
     color:#fff;
     text-transform:uppercase;
     margin-bottom:22px;
}
h3 {
     font-size:18px;
     line-height:1.2em;
     color:#fff;
     background-repeat:repeat-x;
     background-position:0 0;
     background-image:url([[root_url]]/uploads/themes/firefighter/images/title-tail-1.gif);
     padding:12px 0 7px 15px;
     margin-bottom:23px;
}
h3.style1 {
     background-image:url([[root_url]]/uploads/themes/firefighter/images/title-tail-2.gif);
}
h3.style2 {
     background-image:url([[root_url]]/uploads/themes/firefighter/images/title-tail-3.gif);
}
h5 {
     color:#faac09;
     font-size:1.08em;
     line-height:1.5em;
     text-transform:uppercase;
}
     h5.color1 {
          color:#c20526;
     }
     h5.style1 {
          margin-bottom:20px;
     }
h6 {
     font-size:1em;
     line-height:1.667em;
     margin-bottom:20px;
}


.link {
     font-size:14px;
     line-height:1.2em;
     color:#eaeaea;
     text-decoration:none;
}
.link:hover {
     color:#000;
}

.link1 {
     font-size:14px;
     line-height:1.2em;
     color:#161515;
     display:inline-block;
     text-transform:uppercase;
     text-decoration:none;
     background-repeat:repeat-x;
     background-position:0 0;
     background-color:#faa209;
     background-image:url([[root_url]]/uploads/themes/firefighter/images/button-tail.gif);
     padding:9px 11px 9px 11px;
}
.link1.extra {
     background-image:url([[root_url]]/uploads/themes/firefighter/images/button-tail-1.gif);
     color:#fff;
}
     .link1:hover {
          background:#fff;
          color:#000;
     }


.line-hor {
     height:2px;
     background:url([[root_url]]/uploads/themes/firefighter/images/line-hor.png) repeat-x left top;
     overflow:hidden;
     font-size:0;
     line-height:0;
     margin:12px 0 16px 0;
}


/*===== header =====*/
header .bg-top {
     position:absolute;
     right:40px;
     top:124px;
     z-index:10;
     width:196px;
     height:48px;
     background:url([[root_url]]/uploads/themes/firefighter/images/header-bg-top.png) no-repeat left top;
}
header nav {
     position:absolute;
     left:0;
     top:98px;
}
     header nav ul li {
          float:left;
          font-size:14px;
     }
          header nav ul li a {
               text-decoration:none;
               color:#fff;
               float:left;
               padding:30px 10px 28px 10px;
          }
          header nav ul li a:hover,
          header nav ul li a.active {
               background:url([[root_url]]/uploads/themes/firefighter/images/nav-act.gif) repeat-x left top;
          }

header #slogan {
     position:absolute;
     left:181px !important;
     left:182px;
     top:347px;
}

/*===== content =====*/
#content .col-1 {
     width:316px;
     margin-right:43px;
}
#content .col-2 {
     width:316px;
}
#content .indent {
     padding-bottom:39px;
}

/*===== Sidebar =====*/
aside .inside {
     padding:24px 25px 40px 24px;
}
aside dl dt {
     color:#fff;
     font-size:1em;
     text-transform:none;
}

/*===== footer =====*/
footer .inside {
     padding:28px 0 0 0;
}
footer ul {
     width:100%;
     overflow:hidden;
     padding-bottom:8px;
}
     footer ul li {
          float:left;
          font-weight:bold;
          padding-right:22px;
          font-size:1.08em;
     }
          footer ul li a {
               color:#fff;
          }

footer a {
     color:#faa309;
     text-decoration:none;
}
footer a:hover {
     text-decoration:underline;
}


/*----- forms -----*/

#search-form fieldset {
     position:absolute;
     right:0;
     top:32px;
}
     #search-form strong {
          float:left;
          background:url([[root_url]]/uploads/themes/firefighter/images/input-bg.gif) no-repeat left top;
          width:211px;
          height:32px;
     }
     #search-form input {
          background:none;
          border:0;
          vertical-align:top;
          line-height:1.2em;
          color:#fff;
          margin:7px 0 0 5px;
          width:200px;
     }
     #search-form a {
          float:left;
          color:#fff;
          text-decoration:none;
          display:block;
          font-size:14px;
          background:url([[root_url]]/uploads/themes/firefighter/images/button-tail.gif) repeat-x left top;
          padding:8px 8px 7px 8px;
     }
     #search-form a:hover {
          color:#000;
     }

#contacts-form .rowElem {
     width:100%;
     overflow:hidden;
     height:26px;
}
#contacts-form .rowElem1 {
     width:100%;
     overflow:hidden;
     margin-bottom:22px;
}
#contacts-form label {
     width:65px;
     display:block;
     float:left;
}
#contacts-form input {
     width:244px;
     display:block;
     float:left;
     padding:2px 0 2px 3px;
     height:16px;
     background:#222121;
     color:#fff;
     border:1px solid #a4a4a4;
}
#contacts-form textarea {
     width:244px;
     height:167px;
     overflow:auto;
     float:left;
     background:#222121;
     color:#fff;
     border:1px solid #a4a4a4;
     padding:2px 0 2px 3px;
}

/*==========================================*/

und

Hier klicken, um den Code zum Kopieren zu markieren

a, abbr, acronym, address, applet, article, aside, audio,
b, blockquote, big, body,
center, canvas, caption, cite, code, command,
datalist, dd, del, details, dfn, dl, div, dt,
em, embed,
fieldset, figcaption, figure, font, footer, form,
h1, h2, h3, h4, h5, h6, header, hgroup, html,
i, iframe, img, ins,
kbd,
keygen,
label, legend, li,
meter,
nav,
object, ol, output,
p, pre, progress,
q,
s, samp, section, small, span, source, strike, strong, sub, sup,
table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul,
var {
    background:transparent;
    border:0 none;
    font-size:100%;
    margin:0;
    padding:0;
    border:0;
    outline:0;
    vertical-align:top;
}

ol,
ul {
     list-style:none;
}
blockquote,
q {
     quotes:none;
}
table,
table td {
     padding:0;
     border:none;
     border-collapse:collapse;
}
img {
     vertical-align:top;
}
embed {
     vertical-align:top;
}

Template und Stylesheets liegen in der Datenbank und sind miteinander verknüpft. Die Bilder liegen im absoluten Pfad "www.<meine_adresse>.de/uploads/themes/firefighter/images" sowie in der Datenbank vor.

Ich hoffe, dass die Dateien - weil sie etwas umfangreicher sind - nicht allzu verwirrend sind yikes .

Vielen Dank,

Dancer62

Andynium · 11. Juni 2014 21:40

Und was genau funktioniert da jetzt noch nicht?

PS : die Stylesheet Links solltest du natürlich aus dem Head Bereich entfernen. Sonst siehst du ja nicht, ob es wie gewünscht funktioniert.

PPS: das reset Stylesheet sollte in der Auflistung im Backend VOR dem gestaltenden Stylesheet stehen. Der reset Style dient dazu, alle Browser auf die gleiche Voreinstellung zurück zu setzen.

Andynium · 11. Juni 2014 21:44

Und noch ein kleiner Hinweis - {process_pagedata} gleich zu Beginn des Templates kannst du entfernen. Ist in der aktuellen CMSMS Version ohne Funktion.

Dancer62 · 12. Juni 2014 20:41

Geil, es klappt - zumindest teilweise.
Ich habe jetzt das Problem, dass ich auf ein Bild vom Template aus zugreifen will, das Bild aber nicht angezeigt wird. Der zugehörige Code lautet :

Hier klicken, um den Code zum Kopieren zu markieren

<div id="slogan"><img src="images/slogan.png"></div>

Ich vermute, dass der Pfad zum Bild nicht korrekt ist - kann/muss ich hier auch die gleiche Syntax wie im Stylesheet verwenden ?

Außerdem wollte ich probehalber ein oder zwei "News" eingeben, finde aber keine Möglichkeit dazu. Die beiden Content-Blöcke, die ich definiert habe, werden unter "Inhalt" -> "Inhalte bearbeiten" im Backend angezeigt und und ich kann sie auch bearbeiten. Gibt es sowas auch für "News" ?

Beitrag geändert von Dancer62 (12. Juni 2014 20:41)

Andynium · 12. Juni 2014 21:51

Dancer62 schrieb:

Ich vermute, dass der Pfad zum Bild nicht korrekt ist - kann/muss ich hier auch die gleiche Syntax wie im Stylesheet verwenden ?

Bingo wink !

By the way - wenn du noch so am Rumprobieren mit CMSMS bist, ist es sicherlich keine schlechte Idee, ein Modul wie Archiver oder Revisions zu installieren. Hat den Vorteil, dass man wieder auf vorherige Versionen von Inhalten, Templates und CSS zurück kann, quasi 'ne Art Schutz bei Fehleingaben.

Dancer62 schrieb:

Außerdem wollte ich probehalber ein oder zwei "News" eingeben, finde aber keine Möglichkeit dazu. Die beiden Content-Blöcke, die ich definiert habe, werden unter "Inhalt" -> "Inhalte bearbeiten" im Backend angezeigt und und ich kann sie auch bearbeiten. Gibt es sowas auch für "News" ?

Für News bringt CMSMS ein Modul gleichen Namens mit, erreichbar in der Administration via Inhalte > News. Dort kannst du sämtliche News separat und kategorisiert eingeben. Um die News anzuzeigen, fügst du an der Stelle, wo die News erscheinen sollen, im Template einfach

Hier klicken, um den Code zum Kopieren zu markieren

{News}

ein.

PS: Das Modul hat noch eine ganze Reihe Parameter, mit denen sich die Anzeige individuell anpassen lässt (siehe Modulhilfe).

Dancer62 · 13. Juni 2014 08:26

Ich habe den Pfad zum Bild erfolgreich angepaßt (im Browser wird bei Rechtsklick auf das Element und "Element untersuchen" der korrekte Pfad angezeigt), allerdings wird statt des Bildes immer noch das Symbol für ein nicht gefundenes Element angezeigt . Hier muss ich noch mal überprüfen, ob der Pfad tatsächlich stimmt oder ich nicht doch irgendwo einen Schreibfehler drin habe...

cyberman schrieb:

By the way - wenn du noch so am Rumprobieren mit CMSMS bist, ist es sicherlich keine schlechte Idee, ein Modul wie Archiver oder Revisions zu installieren.

Gute Idee, aber wo finde ich das Modul und wie kann ich es bei mir einbinden/installieren ?

cyberman schrieb:

Für News bringt CMSMS ein Modul gleichen Namens mit, erreichbar in der Administration via Inhalte > News.

Die News habe ich gefunden und auch schon ausprobiert - läuft super, danke. Aber jetzt habe ich noch die Frage, wie ich die Zeile "Kategorie: General" wegbekomme, da ich Kategorien aller Voraussicht nach nicht brauchen werde. Ich habe schon die Hilfe durchwühlt, aber in den Parametern nichts gefunden, was mir geholfen hätte. Außerdem habe ich schon versucht, das Detail-Template zu editieren, indem ich alle Zeilen, die "category" enthalten, auskommentiert habe. Aber die Nachrichten werden immer noch mit dem Wort "Kategorie:" (allerdings ohne die Kategorie selbst) dargestellt.

B.t.w.: ich finde, dass Du jetzt ein cooles Outfit hast... cool

Andynium · 13. Juni 2014 11:42

Dancer62 schrieb:

Gute Idee, aber wo finde ich das Modul und wie kann ich es bei mir einbinden/installieren ?

http://dev.cmsmadesimple.org/projects/archiver

Einfach nur installieren, den Rest macht das Modul alleine.

cyberman schrieb:

Aber jetzt habe ich noch die Frage, wie ich die Zeile "Kategorie: General" wegbekomme, da ich Kategorien aller Voraussicht nach nicht brauchen werde.

Such mal sowohl im Zusammenfassungs-Template als auch im Detail-Template nach dem Eintrag {$category_label} wink .

B.t.w.: ich finde, dass Du jetzt ein cooles Outfit hast...

Ja, ist der neueste Trend und ganz angesagt, nennt sich Bio-Hacking big_smile .

h4zebust3r · 25. Dezember 2014 12:26

Hallo und ein Dankeschön an die Community. Dieser Beitrag hat mich ein ganzes Stück weitergebracht und ich finde Ihr macht da eine super Arbeit mit dem CMS ;D

Liebe Grüsse
Alexander

Forum für CMS/made simple

#1 08. November 2013 12:52

[GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#2 08. November 2013 13:47

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#3 08. November 2013 14:04

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#4 08. November 2013 14:06

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#5 08. November 2013 14:09

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#6 10. November 2013 19:27

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#7 10. Mai 2014 22:32

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#8 10. Mai 2014 23:19

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#9 10. Mai 2014 11:06

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#10 18. Mai 2014 21:38

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#11 19. Mai 2014 04:48

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#12 21. Mai 2014 21:11

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#13 22. Mai 2014 08:00

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#14 11. Juni 2014 20:08

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#15 11. Juni 2014 20:36

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#16 11. Juni 2014 21:00

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#17 11. Juni 2014 21:40

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#18 11. Juni 2014 21:44

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#19 12. Juni 2014 20:41

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#20 12. Juni 2014 21:51

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#21 13. Juni 2014 08:26

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#22 13. Juni 2014 11:42

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

#23 25. Dezember 2014 12:26

Re: [GELÖST] "Fremde" Templates in CMS Made Simple importieren ?

Fußzeile des Forums