ページの終わりが右にずれる

Simplicityの特徴 フォーラム Simplicityについての質問 ページの終わりが右にずれる

  • このトピックには10件の返信、2人の参加者があり、最後にHidekichiにより10年、 10ヶ月前に更新されました。
10件の返信スレッドを表示中
  • 投稿者
    投稿
    • #30288
      乾 邦彦
      ゲスト

      お世話になります。テーマを使用させていただきましてありがとうございます。
      アメブロから移転のため現在simplicity.1.8.1を使用させていただいておりましてテーマに基本的な事を入れながら準備中の状態です。

      さて、子テーマを使う方がいいとのご指摘で先日から子テーマに基本的な情報を入直したりと作業しております。
      子テーマを入れてからなのかは不明ですが、サイドバーウィジェットに300×250のアフリエイトとブログ村ランキングの順に表示させようとするとページ内に収まらず表示できません。
      ランキング、アフリエイトと順序を変えると表示されます。
      サイドバーウィジェットには、新着記事、カテゴリー、アーカイブ、そしてテキストでアフィリエイト、テキストでランキングを入れています。

      下にあるロゴ(一番下にコピーを貼り付けています)がページ右にずれていまして右へスクロールすると見えます。以前は、ページ一番下の位置で収まっていました。
      サイドバーウィジェットの下には同じ幅で、何かわかりませんが250×約120くらいの「影」というか何かが存在して表示されています。これ自体はクリックもできません。
      スキンを色の濃いののにするとよくわかりますが、アフリエイトと同じ幅で不明な表示です。

      原因がさっぱりわからず、サイトでも調べてみましたがわかりません。
      親テーマを一旦削除して、新たにインストールもしてみましたが治りません。

      初心者の質問で申し訳有りませんが、どうすれば改良できるのでしょうか。ご教授ください。
      お忙しいところ、ご負担をお掛け致しまして申し訳ありません。

      ⇩これがページの右にずれてスクロールすると表示できる位置にいます。

      WordPress Theme Simplicity
      Copyright© 三日坊主 All Rights Reserved.

    • #30290
      Hidekichi
      ゲスト

      >何かわかりませんが250×約120くらいの「影」というか何かが存在して表示されています。

      おそらくこれが原因なんでしょうけれども、何をどうすれば改善できるかはサイトを見ないと何とも言えません。
      基本的にコピーライトは中央寄せしてあるので、コピーライトが入っているフッターが横に伸びてるんだろうと想像します。

      フッターに何が入っているのかが問題なんですが、その何かはわかりませんし、あるいは、フッターを横に伸ばしている他の要素があると思います。たいていは、pxで要素を指定していて、それが本来の横幅よりも大きいから押し広げてしまっているというのと、場合によっては何かしらタグがきちんと閉じられていないのでおかしな表示になっている場合があるのではないかなぁと思います。

    • #30305
      kunihiko
      ゲスト

      ご返信ありがとうございます。

      サイトは覗いていただけるのでしょうか。
      アドレスはこの投稿に記してもいいのでようか?

    • #30326
      アバター画像わいひら
      キーマスター

      できればアドレスを記していただいた方が、こちらも原因解明がしやすいかと思います。
      テーマ側の不具合ではなくて、プラグイン由来のものなら、原因がわからない可能性もありますけど。

    • #30331
      kunihiko
      ゲスト

      ご返信ありがとうございます。

      アドレスはhttp://3kabouzu.comになります。

      お手数ですが一度見ていただければ助かります。

    • #30335
      Hidekichi
      ゲスト

      今見てみましたが、sidebarはasideと言うタグに囲まれているんですけれども、これが最後のテキストウィジェットに入ってしまってます。つまりは、最後のウィジェットの閉じタグあたりが抜けていたりするのではないかと想像するんですけれども。

      <!-- Rakuten Widget TO HERE —>
      
      // ↓ —> を --> に
      
      <!-- Rakuten Widget TO HERE -->

      これだけでいけるかもしれませんが、何かしら閉じタグがおかしなことになっているように思います。ウィジェットの中身のコードを再度見なおして閉じタグを正確に入れれば直るかと思います。

    • #30339
      アバター画像わいひら
      キーマスター

      とりあえず、ウィジェットを一旦全て外してみてください。
      その後、一つ一つ当てはめていってエラーが出るウィジェットを特定してそのウィジェットのタグに不備はないかなどを見直してみてください。

    • #30354
      kunihiko
      ゲスト

      早くに失礼します。

      早速、見ていただきましてありがとうございました。
      調べた結果、ご指摘の通り楽天のウィジェットの最後のタグコードが抜けていました。
      ページを拝見されただけで一発解決。感動します。

      コード修正後、ランキングと楽天のウィジェットの順番を入れ替えても表示されるようになりました。
      怪しい影もなくなりました。

      無料でテーマを使わせていただき、さらにご質問にもお答えいただいて感謝申し上げます。
      本当にありがとうございました。

      今後もよろしくお願いいたいます。

    • #30359
      Hidekichi
      ゲスト

      直ったサイトをチラリと見せてもらいましたが、画面右下にptengineの小さなバナーと言うかボタンが「トップへ戻るボタン」とかぶっているようです。
      トップへ戻るボタンは、キーボードのhomeを押せば良いので別にかぶっていても支障はないにせよ、なるべくなら誤クリックしないようにしておいた方が良いと思うので、

      #page-top {
        position: fixed;
        display: none;
        right: 10px;
        bottom: 50px; /*← デフォルト10px*/
      }

      のようにして、かぶらないようにするとよりベターだと思います。

      あるいは、

      #page-top {
        position: fixed;
        display: none;
        right: 10px;
        bottom: 10px;
        width: 50px;
        height: 50px;
        z-index: 9999999;
        background-color: #333;
      }
      
      #page-top a {
        color: #fff;
        /* padding: 7px; */
        text-decoration: none;
        display: block;
        cursor: pointer;
        /* text-align: center; */
        background-color: #aaa;
        /* line-height: 100%; */
        border-radius: 4px;
        font-size: 12px;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate3d()-50%,-50%,0;
        transform: translate3d(-50%,-50%,0);
        background-color: transparent !important;
      }

      このようにすると、#page-topのサイズを指定すれば任意の大きさに変更できます。ボタン幅等が大きくなったら中身の矢印も大きくする必要があるので、#page-top aのfont-sizeを任意のサイズに変更すれば良い感じになるのではなかろうかと思います。

      まぁbottom: 50px等にしたら既にかぶらないので、z-indexは不要なんですけどね。ここらはどうされるかわからないので念の為入れておきました。

    • #30360
      Hidekichi
      ゲスト

      ただ、僕は思うのです。
      本来は、

      <a href="#">
        <div id="page-top">
         <アイコン>
        </div>
      </a>

      htmlはこうしておいて、ボタンのどこをクリックしても動作するのが正しいのではなかろうかと。
      あるいは、

      <a href="#">
        <button id="page-top">
         <アイコン>
        </button>
      </a>

      で、良いのではなかろうかと。どうせjQueryでトップへ戻っているので、aタグすら要らないんですけどね。
      まぁここらはわいひらさん次第なんですけども(笑)

    • #30365
      Hidekichi
      ゲスト
10件の返信スレッドを表示中
  • フォーラム「Simplicityについての質問」には新規投稿および返信を追加できません。
スポンサーリンク
アドセンス(大)
アドセンス(大)