mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 11:07 Benutzername: Passwort: Auto-Login

Thema: Wie PHP Content automatisch in Stylesheet einpassen? vom 27.04.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Wie PHP Content automatisch in Stylesheet einpassen?
Seite: 1, 2, 3, 4  Weiter
Autor Nachricht
TOMillr
Threadersteller

Dabei seit: 21.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 27.04.2008 21:11
Titel

Wie PHP Content automatisch in Stylesheet einpassen?

Antworten mit Zitat Zum Seitenanfang

Hallo zusammen,

möchte gerne die mittels CSS realisierten "Stile" im FCKeditor erweitern. Dafür gibt es im Editor ein eigene CSS Datei, welche quasi wie die Formatvorlagen bei Word funktionieren. Leider bin ich mir nicht ganz sicher, wie ich den folgenden Style Code automatisieren kann:

Code:

<p>
<span style="float:left;color:silver;font-size:100px;line-height:70px;padding-top:2px;font-family: times;">F</span>or this one we want to force the first big letter to span about five lines. The font-size is adjusted to exactly 100 pixels while the line height is 70 pixels.  We tried a line-height of 80 but that leaves a little too much white space.
</p>


Der Code wird verwendet, um so einen Magazin-Look mit einem großen Buchstaben am Anfang eines Artikels zu erzeugen:




Wie kann ich diesen Vorgang nun automatisieren, wenn der eigentliche Text über einen PHP Befehl ($content) in die Seite eingefügt wird? Kann man das also irgendwie so hinbekommen, dass wie im oberen Beispiel der kursiv markierte Text quasi eingefügt wird und dabei der erste Buchstabe an der passenden Stelle (vor dem </span> Tag) im Code landet?

Gruß,
Tom


Zuletzt bearbeitet von TOMillr am Mo 28.04.2008 09:30, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Snifferdog

Dabei seit: 08.03.2007
Ort: Düsseldorf
Alter: 35
Geschlecht: Männlich
Verfasst So 27.04.2008 21:25
Titel

Antworten mit Zitat Zum Seitenanfang

Mh naja ...
ich weiß nicht ob es ne sonderlich schöne Lösung ist aber du könntest per Suchmusster den ersten Buchstaben raussuchen und dann durch <span ...> Erster Buchstabe </span> ersetzen.

Code:


$string = "Hier wäre dann der Inhalt";

$suchmuster = "/(^.)/im";
$ersetzung = "<span class=''>$1</span>";

$ausgabe = preg_replace($suchmuster, $ersetzung, $string);

echo $ausgabe;



Sollte auf jeden Fall funktionieren *zwinker*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst So 27.04.2008 21:27
Titel

Antworten mit Zitat Zum Seitenanfang

Du benötigst das span Element eigentlich gar nicht:

http://www.css4you.de/first-letter.html
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Snifferdog

Dabei seit: 08.03.2007
Ort: Düsseldorf
Alter: 35
Geschlecht: Männlich
Verfasst So 27.04.2008 21:50
Titel

Antworten mit Zitat Zum Seitenanfang

Jup das sieht für diesen Fall sehr viel einfacher und besser aus ^^

Gruß
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
TOMillr
Threadersteller

Dabei seit: 21.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 28.04.2008 09:05
Titel

Antworten mit Zitat Zum Seitenanfang

m hat geschrieben:
Du benötigst das span Element eigentlich gar nicht:

http://www.css4you.de/first-letter.html

Hm, interessant - kannte ich garnicht. Hatte mir das andere Beispiel rausgesucht, weil ich das Aussehen des ersten Buchstaben dann noch weiter anpassen wollte. Vielleicht um den Buchstaben einen Rahmen ziehen und unterhalt des Buchstabens noch mehr Freiraum lassen. Geht das mit dem Beispiel auch? Außerdem war es ja Sinn der Sache, dass der Buchstabe nicht einfach nur größer ist, sondern nach UNTEN in den Fließtext herunterreicht.


Zuletzt bearbeitet von TOMillr am Mo 28.04.2008 09:06, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
TOMillr
Threadersteller

Dabei seit: 21.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 28.04.2008 09:40
Titel

Antworten mit Zitat Zum Seitenanfang

Snifferdog hat geschrieben:
Mh naja ...
ich weiß nicht ob es ne sonderlich schöne Lösung ist aber du könntest per Suchmusster den ersten Buchstaben raussuchen und dann durch <span ...> Erster Buchstabe </span> ersetzen.

Code:


$string = "Hier wäre dann der Inhalt";

$suchmuster = "/(^.)/im";
$ersetzung = "<span class=''>$1</span>";

$ausgabe = preg_replace($suchmuster, $ersetzung, $string);

echo $ausgabe;



Sollte auf jeden Fall funktionieren *zwinker*

Habe mal versucht den Vorschlag umzusetzen und folgenden Code verwendet:

Code:

   $string = "$content";

   $suchmuster = "/(^.)/im";
   $ersetzung = "<span style=\"float:left;color:silver;font-size:100px;line-height:70px;padding-top:2px;font-family: times;\">$1</span>";

   $ausgabe = preg_replace($suchmuster, $ersetzung, $string);

echo $ausgabe;


und damit kommt folgendes heraus:




Es ergeben sich also zwei Probleme mit dem Code. Erstmal wird der erste Paragraph, der mit $content eingelesen wird irgendwie doppelt und bei zweiten Mal ohne die Textformatierung ausgegeben. Außerdem wird im $content Quelltext offenbar noch durch den verwendeten FCKeditor automatisch der Tag <p> dem Inhalt vorangestellt, sodass dieser dann als erstes Zeichen erkannt und zerlegt wird. Kann man das irgendwie beseitigen?
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 28.04.2008 10:00
Titel

Antworten mit Zitat Zum Seitenanfang

CrazyLexx hat geschrieben:
m hat geschrieben:
Du benötigst das span Element eigentlich gar nicht:

http://www.css4you.de/first-letter.html

Hm, interessant - kannte ich garnicht. Hatte mir das andere Beispiel rausgesucht, weil ich das Aussehen des ersten Buchstaben dann noch weiter anpassen wollte. Vielleicht um den Buchstaben einen Rahmen ziehen und unterhalt des Buchstabens noch mehr Freiraum lassen. Geht das mit dem Beispiel auch? Außerdem war es ja Sinn der Sache, dass der Buchstabe nicht einfach nur größer ist, sondern nach UNTEN in den Fließtext herunterreicht.


Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title></title>
  <style type="text/css">
    body {
      font-family: Arial;
    }
    p:first-letter {
      float: left;
      font-size: 3em;
      padding: 0.1em 0.1em 0 0;
    }
  </style>
 </head>
 <body>
  <p>Lorem ipsum dolor sit amet, consectetuer sadipscing elitr, sed diam nonumy eirmod
  tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero
  eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
  takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur
  sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
  erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
  clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum
  dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut
  labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo
  duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
  ipsum dolor sit amet</p>
 </body>
</html>
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Mark-Korb

Dabei seit: 11.04.2007
Ort: -
Alter: 38
Geschlecht: Männlich
Verfasst Mo 28.04.2008 10:02
Titel

Antworten mit Zitat Zum Seitenanfang

CrazyLexx hat geschrieben:
m hat geschrieben:
Du benötigst das span Element eigentlich gar nicht:

http://www.css4you.de/first-letter.html

Hm, interessant - kannte ich garnicht. Hatte mir das andere Beispiel rausgesucht, weil ich das Aussehen des ersten Buchstaben dann noch weiter anpassen wollte. Vielleicht um den Buchstaben einen Rahmen ziehen und unterhalt des Buchstabens noch mehr Freiraum lassen. Geht das mit dem Beispiel auch? Außerdem war es ja Sinn der Sache, dass der Buchstabe nicht einfach nur größer ist, sondern nach UNTEN in den Fließtext herunterreicht.


Ja das liegt halt dran wie du ihn definierst.
Kannst es ja mit deinem Codebeispiel von oben versuchen, sollte funktionieren.
alternativ, leg dir ne klasse an und mach es jedesmal zu Fuß, is ja auch nicht DIE arbeit.
  View user's profile Private Nachricht senden
 
Ähnliche Themen Content Editing, statt Content Management
Acrobat DC Pro Text einpassen
Text in Form einpassen
Corel X3 Text in Kreis einpassen
User Stylesheet..
Problem mit Stylesheet
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2, 3, 4  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.