フルワイドな画像を設置する方法をご紹介したいと思います。
フルワイド画像はこんな感じです。↓
◆ここに文字◆
Contents
動画でも説明しています。
動画でも説明していますが、テキストで見たい場合は、このまま下に進んでください。
フルワイド画像の設置の仕方
まずは、ショートコードを張り付けます。
こちらから、ショートコードをコピーしてください↓
1 |
[flw posx="◆centerかrightかleft◆" backimg="◆ここに写真のURL◆" height="◆ここに縦幅の数字◆"]◆ここに文字◆[/flw] |
そして、記事編集画面で張り付けて下さい。
まずはこの部分を選んで、◆から◆までを消して、「center」「light」「left」を選んで入力してください。
↓
このcenter(センター)left(レフト)などはスマホで見た場合の表示位置になります。
写真のどの部分を表示するか選ぶことが出来ます。どの場所がいいか選んで入力してください。
次に、写真のURLを入力します。まずは入れたい写真のURLをコピーします。
メディアを追加を選択して、
選びたい写真をクリック、右側にURLが出るので、URLをコピーしましょう。挿入せずに右上の×で閉じます。
◆ここに写真のURL◆の部分を消して、さっきコピーしたURLを張り付けて下さい。そのあと戻るをクリックして下さい。
※戻るボタンが無い場合は、テキストモードで張り付けて下さい。
URLだけが綺麗に張り付いたら成功です。
次に、ここに◆縦幅の数字◆を消して、写真の縦幅の数字を入力してください。この写真の場合は、800pxなので、800と入力します。
これでプレビューで確認してみましょう。
綺麗に反映されていますね!
最後に、◆ここに文字◆という所に文字を入れると画像の上に文字が表示されます。
プレビューで確認すると、こんな感じになります。
ここに好きな文字を入れて、見て下さい。字を大きくしたり、色を変えたり、色んな事が出来ます。
フルワイド画像の設置の仕方は以上です!