PR

WPとCocoonでLP(ランディングページ)を作ってみました

ブログ運営

SNSマーケティングというとIT系の会社がやっているマーケティングを想像しますが、モノづくり会社においても取り組んでいる会社があります。

はかせ
はかせ

私は、2020年は遅ればせながらTwitterを始めましたが、ある程度リソース(時間)を集中させる必要があるようで、Twitterとブログ連携には取り組めていません・・・。

Webによるマーケティングの1つにLP(ランディングページ)というものがあります。LPはチラシのようなホームページのようなものらしいので、Kindle本を例にLPを作ってみました。

内部監査責任者が作った内部監査の取扱説明書
ISO9000(品質マネジメント)の認証を維持するだけではもったいない。内部監査を利用した業務改善で会社のレベルを上げることもできると思いませんか?内部監査を利用するために監査員教育に使う「ISO内部監査の取扱説明書」を作りました。
振動解析を体験実習から「ハンマリング試験から始めるモード解析入門」
振動は難しい?身近にある振動を紹介した後、バットのハンマリング・データから振動モード形を描いてみます。FEMはFreeCADを使って実験モード解析と固有値解析の結果を比べます。振動の可視化をシミュレーションと実験の体験から始めてみませんか。

ここでは、LP作成時の注意点などを備忘録を兼ねてまとめておきます。

スポンサーリンク

LPに関するWordPress+Cocoonの設定

WordPressでの設定は以下の通りです。

はかせ
はかせ

このブログで、たまたまうまくいっている設定例です。

トップメニューは、PC表示では消えているのですが、画面表示サイズが小さくなると表示されてしまうので、調査中です。

LPの投稿記事の(編集)ページ毎の設定

  • ページの種類
    • 固定ページ
  • 広告の設定
    • 広告を除外する(Google AdSenseで設定)
  • ページ設定
    • 本文のみ(広い)
    • 読む時間を表示しない
    • 目次を表示しない
  • AMP
    • AMPページ生成
  • アイキャッチ
    • 設定する

カスタムCSS

最終的に以下のように「まっさらのページ」に書いています。

  • 「***」は、固定ページのID
.page-id-34 .header {
    display: none;
}

.page-id-*** .gMenu {
  display:none;
}

.page-id-*** .header {
    display: none;
}
.page-id-*** .footer {
    display: none;
}

#header, #footer {
  display:none;
}

.page-id-*** .site-title-img {
  display: none;
}

以下のCocoonフォーラムの記事を参考にしています。(そのままです)

[解決済] CocoonでLPを作りたい。

参考までに、試したCSSの例

  • ページのタイトルを非表示にする
.type-page h1,
.type-page 
.post-meta{
display:none;
}
  • 作成日、更新日を非表示にする(未設定)
    • 「***」は、固定ページのID
#post-*** .date-tags {
display: none;
}
  • ヘッダとフッタを非表示にする
#header, #footer {
display:none;
};

広告除外設定:Google AdSenseが簡単・確実

当初、Cocoonで設定しましたが、このブログでは非表示にならなかったため、Google AdSenseで広告除外設定をしています。

  • 2021.1.8 原因がよく分からないので、Google AdSenseでページ除外設定をしました。

Google AdSensの手順を以下に列挙します。

  • 広告 > サマリー
  • サイトを指定して編集(鉛筆マークをクリック)
  • 広告設定の一番下の「ページ除外」を設定(管理をクリック)
  • 「+除外設定を追加」をクリックしてURLを登録
  • 広告設定に戻って、「サイトに適用」をクリック

参考までにCocoonでの設定方法は以下の2つあります。

  • 固定ページの広告で「広告を除外する」にチェックを入れる。
  • Cocoon設定の「広告>広告除外設定」について、固定ページのIDを指定する。

その他:外観のメニューやウィジットなど

固定ページを追加するとメニューに自動で追加する設定になっていたため、WordPressの設定「外観>メニュー」でメニューに固定ページを自動追加しないようにしました。

はかせ
はかせ

なんかページトップのカテゴリ表示がおかしいと気づき修正しました。

なお、サイトマップへのリンク表示は残しています。

スポンサーリンク

今後の予定

ひとまず、LP(ランディングページ)を作成できましたが、CSSの勉強が必要だと感じています。

様子をみながら気づいたことを追記していく予定です。

ここでは、ブログ運営者としての備忘録も兼ねて、LPについて以下の項目で説明しました。

  • LPに関するWordPress+Cocoonの設定
    • LPの投稿記事の(編集)ページ毎の設定
    • カスタムCSS
    • 参考までに、試したCSSの例
    • 広告除外設定
    • その他
  • 今後の予定
タイトルとURLをコピーしました