WordPress WYSIWYG editor formázása


Nem tudom ki hogy van vele, de ha már egy cms esetében az admin felületen WYSIWYG szerkesztő felületet használok, akkor szeretem a bejegyzés megírásakor olyan formázással látni a szöveget, ahogy az a lapon is meg fog jelenni.

A wordpress admin felületén alapértelmezetten a TinyMCE editor működik, amiben a szöveg a blogom esetében igencsak elüt a ténylegesen megjelenő szövegtől.

Szóval megoldást azt jelent, ha a TinyMCE css fájljába felvesszük azokat a plusz formázásokat, melyeket egyébként használunk a blogon.

Keresd meg FTP-n (vagy a blog sablonszerkesztőjében) az alábbi fájlt:

/wp-includes/js/tinymce/plugins/wordpress/wordpress.css

és ebbe tedd be azokat a formázásokat, melyeket a blogon használsz. Én az alábbiakat tettem be pluszba a CSS-be:

body {
  background-color: #ffffff;
  font-size: 12px;
  font-family: Verdana, Tahoma, Arial;
  color: #505050;
  line-height: 18px;
  }
 
h2, h3 {
  font-size: 18px;
  font-family: 'trebuchet MS', Verdana, Tahoma, Arial;
  font-weight: bold;
  color: #000000;
  line-height:20px;
  }
  h3 {
    line-height:30px;
    }
 
strong, b {
  color: #000000;
  }
 
blockquote {
  margin-left: 0px;
  padding-left: 10px;
  border-left: 1px solid #C6C6C6;
  }

Mentés után az eredmény azonnal látszódik, innentől kezdve a blogbejegyzés írása közben is már azt a kinézetet kapjuk, amit mentés után a látogatók fognak látni.

Kapcsolódó bejegyzések:
  • A CSS-ek elején szoktam ezt a kódot használni ahhoz, hogy minden böngésző alatt az egyébként másként megjelenített részeket azonos kinézetre formázzam.…

  • Nem számít egy nagyon új dolognak a CSS segítségével megvalósított gomb, viszont a dinamikus szélességgel bíró gomb igenis új távlatokat nyit a weblapkészítésben …

  • Na ez egy elég komoly tutorial, php és MySQL kell az elkészítéséhez! Első lépésként csináljunk egy MySQL táblát!CREATE TABLE `shoutbox` ( `id` INT(1 …

  • A különböző böngészők egyes elemek alapértelmezett tulajdonságait másképp értelmezik, ezeket egységesíti az alábbi kódrészlet (a css fájlba kell felvenni):…

  • Font Family: betűcsalád (típus) megadása. Több betűtípus is megadható egymás után, melyeket vesszővel kell elválasztani. Pl.P { font-family: “Times New Rom …

A cikket beküldte: Harder (http://blog.harder.hu)

Szólj hozzá
a WordPress WYSIWYG editor formázása c. bejegyzéshez

- Engedélyezett HTML elemek: <a> <em> <strong> <ul> <ol> <li>
- Forráskód beküldéséhez tedd a kódot ezek közé: <pre lang="php" line="1">Kódrészlet helye itt</pre>