BLOG

超簡単に自動で改行を調整してくれるBudouXを使ってみた

Written by EVOWORX

INDEX

はじめに

日本語のサイトは文章が単語の途中で改行してしまうことがよくあります。

本文など長めの文章ならあまり気にならないですが、タイトルやコピーなど目立つ文章が変な位置で改行してしまうと格好悪いですよね。

これまでは解決方法として、<br>display: inline-blockを使っていましたが、これではすごく手間がかかってしまいます。

BudouXというライブラリを使用することで、超簡単に自動で改行をいい感じに調整してくれます。

それでは実際に使い方を紹介していきます。

使い方

BudouXを利用する方法は以下の2ステップのみです

  • BudouXのライブラリを読み込む
  • 自動改行してほしいところに<budoux-ja>タグを挿入する

BudouXのライブラリを読み込む

まずは<script>タグでBudouXを読み込みます。

<script src="https://unpkg.com/budoux/bundle/budoux-ja.min.js"></script>

自動改行してほしいところに<budoux-ja>タグを挿入する

次に自動で改行してほしいところに<budoux-ja>タグを挿入します。

<budoux-ja>エヴォワークスはクリエイティブとテクノロジーを駆使し...</budoux-ja>

これだけで、文章をいい感じに自動改行してくれるようになります。

以下がデモになりますので、ご確認ください。

おわりに

いかがでしたでしょうか?

BudouXを使うことで、超簡単に自動で改行を調整してくれるようになりましたね。

タグを挿入するだけなので、JSが苦手な人でも使えて非常に便利です。

是非これから使ってみてください!