Otter Blocksのブロック
便利な機能をもつブロックや、よくわからない機能をもつブロックまで、沢山のオリジナルブロックが用意されています。
Masonry
ギャラリーのサイズレイアウトを崩して、チグハグに配置する。Masonryは「石積み」という意味。
Accordion
クリックするとブロックが現れるようなアコーディオン機能を持たせる。SWELLにも装備されている機能。個人的にはSWELLのアコーディオンの方がデザイン性がいいと思う。
タイトル１
隠れるよ。
タイトル２
スッキリするよ。
Advanced Heading
見出しのフォントや文字間をカスタムできる。
明日のおかずは肉じゃが
Button Group
横並びのボタングループ。デフォルトの色や文字色、ホバー時の色など、細かくカスタムできる。
Circle Counter
アニメーション付き円グラフ。
Countdown
ある日付・時間までのカウントダウンを行う。無料では、あまり色々設定はできない。
２０２４年まで、あと
Flip Card
ホバーすると、カードをめくるようなアニメーション発動。正直なにに使うかわからないが、もしかしたら面白い使い方ができるかもしれない、未知数なブロック。
表のタイトルだよ
さぁ、カーソルを合わせてホバーしてみよう。
裏のタイトル
何に使うかはあなたの想像次第！
Icon
Font Awsomeとかのアイコンが使える。アイコンで１ブロック使うので、装飾のワンポイントなどに。
Form
問い合わせフォームを埋め込むことができる。お問い合わせはブログ・ホームページによらず必須＆サイトによって使いどころが変わるので、これは結構使える。
Google Maps
Googleマップを埋め込むことができるが、APIが必要なので面倒かも。
APIを必要としないGoogle Mapの埋め込み方はこちらの記事（私が運営するBear-Fruitのブログ）で紹介しています。
Icon List
リストのマークをFont Awesomeなどから選べる。各項目でいちいち選ばないといけないのでちょっと面倒。
Maps
Open Street Mapという、有志の人々で作られている共同プロジェクトのマップを埋め込むことができます。
Lottie Animation
Lottie Animationは、JSONファイルベースの軽量・高画質なベクターアニメーション。そのLottie Animationを配置することができるブロック。
沢山のクリエイターさんがアニメーションを作って公開している「Lottie Files」（英語）でアニメーションを探すと、色々な作品が出てくる！しかも無料のものも豊富にあるので、見ているだけで楽しい！
Popup
ロード時のポップアップテキストと画像を設定できる。フォームも設定できる。
このページが読み込まれたときに表示されるポップアップはこの機能で作ったもの。
ロード時のポップアップテキストと画像を設定できる。
解説は「Popup」の項で。
Posts
投稿記事一覧を作成できる。結構細かく設定できるし、カスタムタクソノミーから一覧を作れるのは大きい。
Otter Blocksのデモページ２
目次Otter Blocksのブロック 便利な機能をもつブロックや、よくわからない機能をもつブロックまで、沢山のオリジナルブロックが用意されています。 Masonry ギャラリーのサイズレイアウトを崩…
Otter Blocks のデモページ１
Otter Blocksの使い方はこちらで解説しています。（外部リンクです。） アニメーション ※ アニメーションはブロックが画面に現れた一度だけしか発火しません。見逃したら再読み込みしてみてください…
【こんな感じでカスタムタクソノミーの一覧も取得できる。】
【大分市】佐賀関の海へ続く線路
正体は船を海に出すためのレールだよ。 近くに駐車場とかが無いのでちょっと行きづらいかも…。 でも海は綺麗だよ。
【大分市】大在の工場夜景
大在の工場夜景、綺麗だよ。 行くまでの道は結構暗いから気をつけてね。
【佐伯市】二見浦の日の出
夫婦岩から見る日の出は最高に綺麗だよ。 夫婦岩のしめ縄はギネスにも乗ったことがあるデカさだよ。
Progress Bar
アニメーション付きプログレスバー。
Product Review
商品レビュー。結構細かく設定できるし、商品リンクのボタンがあるのはありがたい。デフォルトは１０段階評価だが、５段階評価にも変更可能。
Z250のハイシート
なんだかんだ、Z250に乗るならハイシートおすすめ。
良い点
クッション性よし
ポジションがよくなる
微妙な点
ちょっとお高め
足つきが悪くなる
Section
ブロックを縦に２〜４のセクションに分ける。幅の比率も自由に設定できるし、カスタム度が高い。「カラム」ブロックの豪華機能付きバージョン。
こんな感じでセクション分けができる。
これは２つのセクションに２：１の幅の比で分けている。
なんか、このセクションの上のような装飾もできる。
結構色々と調整できる。
Sharing Icons
シェアボタンを設置する。用意されているボタンがちょっと海外向けのSNSなので、正直使いにくいかも。
Slider
画像スライダーを設置する。勝手に次の画像に流れる「Autoplay」もあるので、トップページの表現とかに結構使えるかもしれない。
Stripe Checkout
決済サービスStripeのAPIを使って支払いボタンを埋め込める…らしい。
オリジナル商品などがあれば、ユーザーの支払いに使える。
Tab
タブブロック。タブの背景など、結構細かく設定できる。SWELLにもタブブロックがあるが、結構カスタムできる部分が違うので、好みだったり状況によって使い分けてもいいかも。
１つ目のタブのコンテンツだよ。
２つ目のタブのコンテンツだよ。
３つ目のタブ。
