Tips

Ghostでコードブロックや画像を折りたたむ方法

Tips

Ghostでコードブロックや画像を折りたたむ方法

GhostのエディタではCardsという機能を使って記事本文中に様々な要素を埋め込むことができます。 Editor cardsJump to a card * Images * Markdown * HTML * Gallery * Divider * Bookmark * Email content * Email call to action * Public preview * Button * Callout * GIF * Toggle * Audio * Video * File * Product * Header * Embeds * Signup Card The Ghost editor includes rich media objects called Cards, which can be inserted into your content to add

ghost updateをすると編集したテーマファイルが元に戻ってしまう問題の解決策

Tips

ghost updateをすると編集したテーマファイルが元に戻ってしまう問題の解決策

以前Sourceテーマのファイルを編集して、タグ一覧のページを作りました。 Ghostブログにタグ一覧ページを作る (Sourceテーマの場合)記事を分類するのにタグをつけているのですが、いくらタグをつけたところで絞り込みに使えないのであれば何の意味もないですよね。 僕はSourceというGhostのデフォルトのテーマを使っているのですが、このテーマだと、それぞれのタグをそのままナビゲーションバーに設置することはできるんですが、ドロップダウンでタグを選んだり、タグの一覧を表示したりはすぐにはできないようです。 そこで今回は、Sourceテーマを使ってタグ一覧のページを作ってみましたという記事です。 Sourceテーマを使ってタグ絞り込みをしたいときにできること 上でも述べましたが、このテーマだと、ドロップダウンとか一覧ページはそのままだと出せません。 できるのは、それぞれのタグをナビゲーションバーに置くくらいです。 これは例えば、「ブログ」というタグをつけた記事があって、そのタグを持っている記事一覧を出せるようにしようと思ったら、ナビゲーションバーに「ブログ」という項目をわざわざ作ら

GhostにCode injectionでThree.jsの3Dモデルを埋め込んでみる

Tips

GhostにCode injectionでThree.jsの3Dモデルを埋め込んでみる

Three.jsを使って作られた3Dモデルをブログ記事の中にCode injectionを使って埋め込めるのかなとふと思ったので試してみました。 本文中でHTMLカードに<canvas>タグ、Code injectionのヘッダに<style>タグでCSSを、<script>タグでJavaScriptを貼り付けると、ちゃんと動かすことができました。 埋め込んだのはThree.jsのマニュアルにあった以下の例です。 three.js manual コードの中身は全く理解できていませんが、3Dって面白いですね。 Three.jsでは3Dモデルをインポートして使用することもできるようですが、以下のようなところから素材を使わせてもらうこともできるみたいですね。 OpenGameArt.orgというサイトで、ゲーム制作をしている人には有名なのかもしれませんが、僕は初めて知りました。 OpenGameArt.orgOpenGameArt.org 素材によってライセンス形態が異なるようですが、先日の記事で描いたCC0みたいなライセンスにしてある3D素材もあって、Three.j

Joseph Mallord William Turner "Mortlake Terrace", 1827 | Courtesy National Gallery of Art, Washington

Tips

部屋に飾る絵画とブログの画像

僕は特別アートに詳しいわけでもないですが、たまに絵を見たくなることもあります。 そういうとき、思い切って美術館に行くこともあるにはあるんですが、基本的に出不精なのでネットで調べて満足してしまうことが大半です。 ただやっぱり画面の中で見るのはその一瞬だけですし、なんだか味気ないってのも正直あります。 この記事は、そんなときはパブリックドメインになっている絵画データを印刷するとなんかいいよってことを伝えたくて書きました。 こういう自由に利用可能な素材はブログの画像なんかにも使えるのもいいですよね。この記事のトップにもパブリックドメインの絵画をお借りして載せてみました。 パブリックドメインってなんぞや 高画質な絵画データでもパブリックドメインで無償でダウンロード可能になってるものが結構あったりします。 パブリックドメインとは、誰でも自由に利用可能(商用利用含む)な素材です。 パブリックドメインになっている素材は大きく分けて、 1. 著作権が切れたもの 2. 著作者がパブリックドメインにしたもの(CC0と表記されている) の2種類があるようです。 💡僕は

テキストエディタUlyssesの使い方メモ (使用1週間の感想)

Tips

テキストエディタUlyssesの使い方メモ (使用1週間の感想)

Ulyssesの試用期間の1週間が過ぎて、明日から課金が始まるという段階でこの記事を書いています。 ここでは1週間使っている間によくわからなくて調べたことをメモがわりに置いておきます。 Ulyssesを使い始めた経緯 先日、Ghostでブログを書くためのエディタを探していて、iA Writerとどっちにするか迷った上でUlyssesを使ってみることに決めたという記事を書きました。 Ghostでブログを書くときのエディタの話 (Ghost editor, iA Writer, Ulysses)Ghostでブログを始めるにあたり、記事を書いたりメモをしたりするのに使えるエディタを探した時の記録です。記事の管理や投稿にストレスの少ない環境を作って、ブログを継続しやすくできれば良いなと思っていくつかエディタを試してみました。 エディタの条件 そもそもGhostには記事を書く際のエディタ(以下Ghost editor)が標準で用意されています。 Intro to the editorGhost has a powerful visual editor with familia

ブログ開始時にやったGhostのカスタマイズを紹介

Tips

ブログ開始時にやったGhostのカスタマイズを紹介

Ghostをインストールするとすぐにブログを書き始めることができますが、テーマを変えたりCode injectionを利用することで、デザインや機能を自分の好みにカスタマイズすることもできます。 この記事では、僕がブログ開始時に行った設定やカスタマイズをまとめておこうと思います。 設定 一般的なデザインや機能については、GhostダッシュボードのSettingから設定することができます。 基本的にはSettingの項目を上から順に見ていって、自分に必要なものを設定するだけなので、ここでは少し時間がかかったり、分からなくて調べたところだけ書いておきます。 テーマの選択と簡単なカスタマイズ 無料テーマと有料テーマ テーマは公式が用意している無料のものでも18個あって、目的に応じて選択することができます。 正直、今の僕は無料のものでも十分満足したので、有料のものはそれほど詳しく見ていないのですが、GhostのMarketplaceから色々なテーマを購入して使用することもできます。 Ghost Themes - The MarketplaceDiscover b