• 解決済 sunhyo

    (@sunhyo)


    質問いたします。

    Pinboardという、テーマを使っています。
    フロントページ(トップページ)を、固定ページにした場合、固定ページのタイトルが表示が表示されますが、こちらを非表示にしたいです。
    当方はCSSもPHPも勉強している最中でよくわかりません…。

    フォーラムや、Googleなどで検索しますと関連する内容は存在するのですが、Pinboardでの方法が記載されている物が無く質問させていただきました。

    トップページのみタイトルを非表示にしたい。のが第一の希望ですが。
    トップページ(フロントページ)以外の全固定ページのタイトルも非表示にしたいです。
    テーマが、Twenty Fourteenなどの場合は該当の情報がありました。
    ですが、私はCSSやPHPの知識が無いのでPinboardに適応させる方法がわからず困っています。
    Pinboardを用いた時に、固定ページのタイトルを非表示にする方法を知りたいです。

    よろしくお願いします。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • CSS で希望が可能に成るのでしたら、IDかクラスの要素を見つければ置き換えて考えれば応用できますよ。

    テーマが、Twenty Fourteenなどの場合は該当の情報がありました。

    調べて理解できた情報を具体的に書いてください。

    トピック投稿者 sunhyo

    (@sunhyo)

    ありがとうございます。

    テーマ= Twenty Fourteenの場合ですが、style.cssに下記のコードを追加することでTwenty Fourteenでではありますが、固定ページのタイトルが非表示になりました。

    他のテーマの固定ページのタイトルを非表示にする場合、セレクタ”.site-content や .entry-header”を指定しなおせば良いと書かれていましたが、前記したように私にはさっぱり意味がわからず困っています。

    テーマ= Twenty Fourteen
    追加する場所= style.css

    全固定ページのタイトルの非表示

    .site-content .entry-header {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    background-color: transparent;
    }

    フロントページに指定した固定ページのタイトルの非表示

    .home .site-content .entry-header {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    background-color: transparent;
    }

    その2
    テーマ= Twenty Twelve
    編集する場所= content-page.php

    <article id=”post-<?php the_ID(); ?>” <?php post_class(); ?>>
    <header class=”entry-header”>
    <h1 class=”entry-title”><?php the_title(); ?></h1>
    </header>

    <article id=”post-<?php the_ID(); ?>” <?php post_class(); ?>>
    <header class=”entry-header”>
    <?php if(is_front_page()) : ?>
    <?php else : ?>
    <h1 class=”entry-title”><?php the_title(); ?></h1>
    <?php endif ?>
    </header>

    に、した場合、フロントページ(トップページ)に設定した固定ページのタイトルが非表示になりました。

    よろしくお願いします。

    Twenty Fourteen で希望通りに出来たのですから、目標達成は目前です。
    ブラウザの「要素の検証」(や「要素の詳細を表示」など、ブラウザにより名称はそれぞれですが)を利用して、Pinboard ではセレクタ名がどうなっているかを突き止めましょう。

    現段階で理解し学んでおかないと、セレクタ名、関数の名前はテーマそれぞれで異なりますので、テーマを先で変更した時にまた同じ問題にぶつかることに成りますよ。

    トピック投稿者 sunhyo

    (@sunhyo)

    ありがとうございます。

    結果を先に書きますと、下記の内容を”style.css”の最後に追加することでPinboardでの非表示化に成功しました。

    現コード
    .twothirdcol .entry-header {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    background-color: transparent;
    }

    ブラウザは、GoogleChromeを使用しておりGoogleChromeの場合、要素の検証という名称でした。
    要素の検証を用いて、Twenty FourteenとPinboardをひたすら比較し続けた結果、下記(比較内容)の内容が同一のものではと思い”元コード”を書き直してファイルを更新したところ目的どおりにページタイトルの非表示化をすることが出来ました。

    比較内容
    Twenty Fourteen
    <div id=”content” class=”site-content” role=”main”>
    <header class=”entry-header”>

    Pinboard
    <section id=”content” class=”column twothirdcol”>
    <header class=”entry-header”>

    元コード
    .site-content .entry-header {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    background-color: transparent;
    }

    当初、Pinboardの”column twothirdcol”で一つのセレクタかと思い指定しましたが、非表示化されず試しに”twothirdcol”を指定したところ非表示化されました。

    同様に、<header class=”entry-header”>下の行にある”entry-title”を指定して非表示化されはしましたが、”元コード”には”entry-header”が指定されていましたので、”entry-header”に指定しなおしました。

    当初どのようにして調べるのかも分からず困惑していましたが、ヒントをしり手探りではありますが一応目的を達成することが出来たと思います。

    ありがとうございました。

    トピック投稿者 sunhyo

    (@sunhyo)

    追記

    セレクタについて追記いたします。
    レイアウトを変更した場合、セレクタが変化するという事があるという事が後でわかりました。
    再度セレクタを調べ指定しなおすと非表示にすることができました。

    セレクタはテーマやレイアウトを変えるたびに変化し毎回指定しなおさなければならない様ですが、そのことを指摘してくださり教えてくださった맹조様ありがとうございます。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • トピック「固定ページのタイトルを非表示にしたい。」には新たに返信することはできません。