alexa  Menu
PrismJs Wordpress kurulumu ve kullanımı

Prism Js WordPress kurulumu ve kullanımı

  14.05.2018 ,   yorum yapılmadı ,   2.488 kez okundu.

Bir önceki paylaşımımda Prism JS`in projelerinize nasıl entegre edileceğini anlatmıştım. Ama daha çok blog yazarlarının bu eklentiyi kullanmak isteyeceğini düşündüğümüzde WordPress için Prism JS kurulumu ve kullanımı konusuna değinmek istiyorum.

WordPress için Prism Syntax Highlighter for WordPress eklentisi mevcut. Eklentiyi buradan indirebilirsiniz. Aslında başka eklentiler de mevcut.

Bu eklentiyi kurduktan sonra normalde makalelerinizde kod parçacığını paylaşmanız mümkün. Yine kod paylaşırken aşağıdaki şekilde paylaşım yapmanız lazım:

<pre><code class="language-css">p { color: red }</code></pre>

Fakat şöyle bir durum var bu eklenti kurulu olsa bile sadece makalelerde kullanılıyor. Diğer alanlarda kullansanız da gözükmeyebilir. Bu sebeple temanız içerisindeki functions.php dosyasına aşağıdaki kodları eklemeniz lazım:

add_action( 'wp_enqueue_scripts', 'my_prism_loader' );

function my_prism_loader() {
	//if ( /* your condition */ ) {
		wp_enqueue_style( 'prism' );
		wp_enqueue_script( 'prism' );
	//}
}

Bu durumda Prism css ve js dosyalarını her bir sayfada include ediyor. Ama sadece belirli sayfalarda kullanmak isterseniz koşul yazmanız gerekiyor. Şimdilik koşul kısmını ben yorum satırlarıyla kapattım ama siz isterseniz açarak koşulunuzu yazabilirsiniz.

Bir diğer kısım wordpresste Prism js kullanmanın bir başka yolu da Custom Fields (Özel Alan).

[prism field="custom_field_name" language="php" class="line-numbers"]

Yukarıdaki şekilde kodunuzu direk editöre yazabilirsiniz. Fakat bu durumda özel alanı belirlemeniz gerekiyor ve paylaşacağınız kod parçacığını özel alanda paylaşmalısınız.

Daha açıklayıcı olması için aşağıdaki videoyu izleyebilirsiniz.

Yorum yapın..

isim yerine gerçek isim ve soyisim yazılmadan yapılan yorumlar kesinlikle onaylanmıyor bilginiz olsun.


The reCAPTCHA verification period has expired. Please reload the page.


%d blogcu bunu beğendi: