Muhtemelen duydun Hayalet blog dünyasını fırtınaya sürükleyen yeni ish blog platformu; bu basit, şık, seksi; Bu canlı önizleme şey var. Ne sevilmeli?
Taşınıyorum Hayalet WordPress arka planında birçok web tasarımcısı gibi. Ama önce kafamı dolaştırmadan önce WordPress 'şablon fonksiyonları, onlarca, muhtemelen yüzlerce CMS seçeneği denedim. Daha akılda kalanlardan bazıları şunlardır: ExpressionEngine , Textpattern , talihsiz FrogCMS , eski, eski bir senaryo CuteNews , ve daha fazlası.
Uzun bir süre için WordPress bana ihtiyacım olan her şeyi verdi: güçlü şablon fonksiyonları; sonsuz bir eklenti kaynağı; sadece ne yapabileceğimi görmek.
Ancak WordPress, bir süredir bir bloglama motorundan çok daha fazlasıdır. Çerçevenin alanına doğru bazı yönlerden sürekli olarak ilerliyor. Bir yayınlama çerçevesi, eğer istersen.
Yazılımları istediğim noktaya geldim, bu bloglar, ve hepsi bu. Mesajlarımı yazmak istiyorum Markdown , bazı anahtar kelimeleri yazın, bir veya iki resim ekleyin ve yayınlayın, ardından tüm şeyi unutun.
Çıkmaz bir blog platformu için arzumda yalnız değilim. Hayaletin arkasındaki yaratıcılar, bloglama sürecine eklediğimiz tüm bu kasıma yol açmak için büyük çaba sarf ettiler ve işi bitirecek basit, hızlı bir yayın platformu inşa ettiler. Bu tamamen farklı bir yaratık.
Felsefe üzerine bloglama için bir CMS'nin bir şey yapması ve bunu iyi yapması gerekir. Çok fazla kişiselleştirme olmadan bu platformda başlatılan dergileri göremezsiniz. Bu bir blog ve onu başka bir şeye dönüştürmek amacını bozguna uğratır.
Ardından, yeni teknolojilere dayanan bir gerçek var. Hayalet üzerine inşa edilmiştir node.js , tarayıcıda değil, sunucuda JavaScript kodu çalıştırır. PaaS'ın ev sahipliğini seven aynı kişiler tarafından seviliyor ve benim gibi insanların benim anlayabildikleri tüm yeni sistemler. Bir anlamda, get-go'dan geleceğin koruması oldu. Yeni nesil CMS'nin ilk neslinin bir parçası.
Blogger'ın bakış açısından, blog için sadece basit bir arayüz. Son kullanıcının bakış açısından, belki de varsayılan blog teması dışında bir şey gerçekten değişti biraz "düz" görünüyor. Ama kaputun altında, tamamen yeni bir şey görüyoruz ve bu iyi bir şey.
Hayalet yükleme kolay yolu.
Tipik olarak, Ghost'u yerel bir makineye yükleyip çalıştırmak için bir bileşen veya iki tane de ayrı ayrı yüklemeniz gerekir. Node.js'yi kurmanız gerekecek ve daha sonra komut satırından manuel olarak fazladan Düğüm paketlerini yüklemeye başlamak zorunda kalacaksınız.
Bu doğru, Ghost için tipik kurulum komut satırını kullanmasını gerektirir. İnsanlar daha çok WordPress'in “beş dakikalık kurulum” sürecini MySQL veritabanlarıyla ve grafik yükleyiciyle kullanırken, bu rahatsız edici olabilir.
Mac veya Linux makinesinde komut satırını kullanmaya alışkın değilseniz, boyunda bir ağrı olabilir.
Neyse ki, tür insanlar üzerinde bitnami Windows, Mac ve Linux için grafiksel yükleyiciler yaptı.
İzlemeniz gereken adımlar şunlardır:
Yükleyici, ihtiyacınız olan tüm bileşenleri (örneğin, Node.js ve bir mini sunucu) sağladığından, dosya dizini tam olarak basit değildir.
Hayalet yerleştirdiğiniz klasörü açmanız ve daha sonra apps / ghost / htdocs / adresine gidin. Bu gerçek Ghost kurulumu.
Temalar uygulamalar / hayalet / htdocs / içerik / temalar / yer almaktadır .
HTML ve CSS'yi bildiğiniz sürece hayalet temaları yapmak oldukça kolaydır. Programlama bilgisi yararlıdır, ancak kesinlikle gerekli değildir. Ghost'un şablonlama sistemi basit ve hatta sezgisel, eğer WordP için tema oluşturduysanız… ahem, daha önce diğer CMS'ler.
Biliyorum biliyorum. WordPress ile karşılaştırma eskidir. Ancak bu yazılımların bir kaç yıldır piyasaya hâkim olduğu - Photoshop'un resimler için olduğu gibi - karşılaştırmalar kaçınılmaz. Bu durumda, onlar bile yararlıdır.
WordPress temaları hazırlayan kişiler, daha basit olsa da, tanıdık olmak için dosya yapısını ve şablon dilini bulabilirler. WordPress 'PHP fonksiyonları size çok esneklik sağlar; ama aynı zamanda tema kodlama sürecini de zorlaştırıyorlar.
Ghost'un şablonlama sistemi (dahili Gidon ), semantik, güçlü ve çalışmakta olduğumuz ham PHP işlevlerinden çok daha okunaklı. Şahsen, kullanımı çok daha kolay buluyorum.
Öte yandan, sadece bloglar oluşturmak içindir. Bu şeyle bir melez haber sitesi / sosyal ağ / forum oluşturmayacaksınız. Daha basit, ancak sınırlı. Bu, tüm platformda doğal olan ticaret.
Hayalet için temel bir tema oluşturmak.
Şimdi, videoyu izlediyseniz (gerçekten yapmanız gerekir), çok temel bilgileri öğreneceksiniz. Hayalet kurulumunuzu geliştirme modunda olacak ve birlikte çalışmak için çok sınırlı bir temaya sahip olacaksınız.
Özetlemek gerekirse, teknik olarak bir Ghost teması yapmak için sadece üç dosyaya ihtiyacınız var:
index.hbs (This template will list your posts)post.hbs (This will display a single post)package.json (This contains theme information)
Ancak, muhtemelen eklemek istediğiniz diğer temel şablonlar vardır. Elbette sayfalar, yayınlar, yazarlar, etiketler ve daha fazlası için özel şablonlar oluşturabilirsiniz. Tüm bunlara zamanla ulaşacağız.
Şimdilik sadece temel konulara odaklanmak istiyorum: tema yapısı, şablon dosyalarının genişletilmesi ve HTML'nin tümünün nereye yerleştirileceği. Bu, orada bizim Ghost temanıza bazı ekstra dosyalar ve klasörler eklemek anlamına gelir. Gözden geçirilmiş yapıya bir göz atalım:
default.hbsindex.hbspage.hbspost.hbspackage.jsonassets/css/images/javascript/partials/ (Just examples, here. Not required.)navigation.hbsloop.hbs
default.hbs , temanızın temeli olarak hareket edecektir. Sizin ,
, ve etiketler buraya gidecektir. Diğer her şablon, bunun içinde 'içte' hale getirilecek. Şimdi, bu şekilde yapmak zorunda değilsiniz; ama standart bir uygulamadır ve Ghost devlerinin kendileri tarafından şiddetle tavsiye edilir.page.hbs tam olarak düşündüğünüz şey, statik sayfalar için şablon. Varlıklar klasörü oldukça açıklayıcı.
Parçacıklar / klasör, çeşitli şablonlarda birden çok kez kullandığınız bit ve kod parçalarını saklamanız gereken yerdir. Örneğin, navigation.hbs sitenizin adını / logosunu ve birincil gezinmeyi içerebilir. loop.hbs , bazı genel HTML ve stil içeren yayınların bir listesini verebilir. Bu, sitede birçok yerde kullanılabilir.
Öyleyse size şablonlamanın ne kadar basit olduğunu gösterelim. Öncelikle, default.hbs dosyasını kuracağız :
{{! Here we see the functions for page titles and descriptions. }}{{meta_title}} {{! Anything in the assets/ folder can be easily linked to, like so: }}{{! This function here outputs meta keywords, some styling information, stuff like that. }}{{ghost_head}}{{! Any .hbs file in the partials folder can be called in like this. }}{{> header}}{{! This is where the content of all the sub-templates will be output. }}{{{body}}}{{! Like ghost_head, this outputs scripts, data, that sort of thing. Currently adds a link to jQuery by default. }}{{ghost_foot}}
Şimdi navigation.hbs şablonunu oluşturalım, çünkü bu her sayfada olacak:
{{! This should be fairly self-explanatory. }} {{@blog.title}}
{{! Each post excerpt will be displayed with this same markup. }}{{#foreach posts}}» {{/her biri için}}{{! Bağlantıların sonraki ve önceki sayfalarına bağlantılar. Yönetici panelinde her sayfada kaç tane bağlantı olduğunu tanımlayabilirsiniz. }} {{Sayfalama}}
Şimdi, aksi belirtilmedikçe, ana sayfa olarak da işlev görecek olan index.hbs şablonuyla birlikte bağlayacağız. Bunun için kod, HTML’nin çoğunu nasıl ayırdığımızı ve düzenlediğimizi görmek çok basittir:
{{!< default}}{{! That isn't a comment up there. It tells Ghost that everything on this page must be rendered inside the default.hbs template.}}{{! This next function can be used to call in anything in the partials/ folder. In this case, we're calling up everything we just put into "loop.hbs". }}{{> loop}}
Ve bu kadar. Basit olduğunu söyledim!
Sorun yaşıyorsanız, Ghost'un varsayılan temasını ve belgeleme . HTML ile oynayın, şablon sistemiyle oynayın ve temanızı şekillendirmeye başlayın.
Bir dahaki sefere biraz daha derine ineceğiz. Bu arada eğlenin!