記事一覧
簡単なペライチページを作ってみよう④
作ったページを開いてみます。
そしたら上の方に編集画面に行く「Elementorで編集」とあるのでクリック
するとこうやって、クリックして内容変えて、といった感じで可視で編集できる画面に飛びます。ここでそれぞれの場所に入れたい内容を変えていけばOKです!
こういったところも、アイコンを選んで左のタイトル・説明を入れるだけ。
もちろんリンクで同ページ内の他の段落や他のページに飛ばすことも可能です
簡単なペライチページを作ってみよう③
さっそく自分にあったページデザイン。探していきましょう!
ビジネス・オフライン店舗ビジネス・美容や運動関連・その他プロ・個人サイト・イベントや教育関連・ECサイト/Eラーニング・ブログ
残念ながら、有料では絞れても無料で絞れる機能は今のところ(2023.04現在)ないので、気をつけて選んでいきましょうぜ・・・
ちゃんと必要な画像のサイズまで入っているので楽ちんですね!
ところで画像加工はでき
簡単なペライチページを作ってみよう②
じゃあ次にテーマを設定しましょう。かっこいいページを簡単に作るにはこれがないと始まりません。
簡単なペライチページを作ってみよう①
みなさん、こんなサイトが無料で簡単に作りたくてこちらをご覧になってますよね??
無料で簡単にあっという間に作るなら、最後まで諦めずに記事の通りにそって進めるだけです!頑張りましょー!
まずは最初に揃えておきたいWordpressのプラグインたち。
11.HTMLウィジェットの使い方
これ使ってみましょうか!ではいれたい場所にドラッグしてください。
コードの1行目から書いていきます。
今回は、テキストエディターウィジェットもあるけど、簡単に文章の挿入を例に。
間に入れたものを中央表示にしてくれる<CENTER>タグを書きました。
これ便利なのが、センターの始まりタグ書いたら勝手に終了のスラッシュで閉じるタグを表示してくれる!
終了タグが表示されるのとされないのあるから、されな
⑨ちょっと!レスポンシブにしたはいいけど横幅が狭いわよ!
そうですよね。今たぶん横幅の決まったボックスの中に画像が並んでいる状態だと思われます。せっかくデスクトップには横に長いどーーーんって写真使ったのにページいっぱいに広がっていない!って感じですよね。
ではその画像をクリックしてください。
高度な設定の幅は100%にしてください。
プレビューしてみて?どお?
まだいっぱいじゃない!ってひとは下記を参考に隙間を調整してね!
では次の記事はコチラ▼
⑩画像を横並びにしてみまひょ
今までやった通りに「画像」ウィジェットで横に並べたい画像を
追加していきます。
追加したら、一番最初のものからクリックして設定していきましょう。
全ての画像に適用していくと横並びになります。
しかーーーーし!これ、カラム幅を超える画像サイズだと、横幅足りないから結局横には並ばないので、画像サイズもチェックしてね☆
⑧次はレスポンシブデザインをちょこっと!
トップ画像をデスクトップ用とスマホ用と作っていただいたんではないでしょうか?
はい、ではそれ並べていきます〜
さっき画像を入れた要領でまずはデスクトップ用を入れてください。
そしたら今入れた画像をクリックして・・・次に注目すべきは
ここで、この画像をスマホで見たときの表示にするかデスクトップの時にだけ表示するかが選べます。
今入れた画像はデスクトップ用なのでタブレットとモバイルで隠しましょう
Wordpressの設定でURL変更しちゃった・・・
いやーもうどうしていいのか慌てますよね・・・2度経験したのでもう大丈夫な気がしますw
みなさん、絶対Wordpress内の設定>一般設定からURLを変更したらダメですよ!ログイン画面のURLまでおかしくなっちゃってできなくなりますよ!
おかしくなったからこのページを見てるんだと思います。
ではまずFTPを用意してください。
WinならFFFTP・MacならFileZillaが主流かと思います。
⑤Elementorでページを編集していこう
では、いよいよ広告LPつくっていきます!
ヘッダーも何もない真っ白なページに作って行きたいので、
左下の「設定」で環境を整えて行きます。
プレビューしたらまだフッターがありませんか!?一旦公開したら、他にももろもろ消して行きましょう
どうすか!右のパーマリンクのURLクリックしたら反映された?されてないよね!されたって言ってる人視力検査ね!
リターン画像を作ろう!
Makuakeのリターン画像では、以下のことに注意したらいいと思います
・商品がよく見えるか
・割引率もしくは定価からの値下げがわかるかどうか
・何個限定がわかるか
・デザインがマッチしているか(高級感?ポップさ?シンプルさ?)
①「新規作成」「Web」の690×388のサイズでアートボードを用意します。
②次に土台になる写真を持ってきてください。
(別でファイルを開いて全て選択[Ctrl+
Makuakeの編集について
基本情報
プロジェクト説明
※リターン品の配送が完了するまで、(会社名)は(商品名)の日本における独占販売権を有する正規代理店です。詳細に関しては、ページ下部のリスク&チャレンジをご確認ください。
私は商品名をマークアップしてその商品のイメージカラーにしてる!色々工夫してみてください!パクリOK!
画像と画像の隙間が開くので背景色作ってる画像とかは繋がりません。文字の改行はCtrl+Ent
⑥次は画像を入れていってみよう!
固定ページ一覧からさっき作ったページの編集画面に入って
ではいよいよ画像いれていきます。
パソコンに保存してある、作った画像データを入れていきます。
まとめて選択してもよし、ひとつずつ選択してもよしです!
するとさっきまでなかった画像イメージが左メニューに表示されます。
そしてまた上の「画像メニュー」をドラッグから繰り返します。
メニューに戻るには右上のアイコンメニューマークをクリック
⑦画像の隙間をなくしたい!
あれ?せっかく画像を繋げたくてデザインしたのに間があいてる!
だっさ〜〜〜〜〜い!!!これ引っ付けたいんだけど!
大丈夫。Elementorは無敵です。
隙間を無くしたい画像の上にカーソルを合わせると
カラムはページをいくつに分けるか、別れてるそれぞれの枠内のことをカラムっていいます。
まあ、Elementorキャンバスは基本1カラム(ページが縦に分割されていない)んですが、ここで例の謎の隙
③固定ページを作ろう
それではいよいよLPに取り掛かるための第一歩(さっきまではスタートラインに立つための準備的な?チェケラ?)にとりかかりましょう。
固定ページってのが、まぁ言えばサイトの1ページ1ページになるわけですよ。なのでLPの1枚まるまるをここで固定ページとして用意します。
タイトルは分かりやすく商品名がいいかと。
日本語を入れるとめっちゃ長いURLを生成しちゃうので商品名をアルファベットで簡潔に!
こ