henlykun
フォーラムへの返信
-
フォーラム: 使い方全般
返信が含まれるトピック: トップページの画像と記事を横に並べて表示したい。フォーラム: 使い方全般
返信が含まれるトピック: トップページの画像と記事を横に並べて表示したい。いろいろ試していたらindex.phpの<div id=”masonry-wrap”>を削除したら
無事、サイドバーの横にサムネイルの画像が並びました。
ただ並び方が変でして5つの投稿記事のサムネイル画像が並んでいるのですが、1.2.3 4 5
というような不思議な並び方になってしまいます。ブラウザの幅を変えると表示は普通なのですが、何か原因があるのでしょうか?
フォーラム: 使い方全般
返信が含まれるトピック: トップページの画像と記事を横に並べて表示したい。nobita様
お答えいただきありがとうございます。
確認したのですが、</div>も中に入っております。
</div>は外に二つあるのですが、別の<div>があるのでそこは問題ないと思います。
試しに消してはみましたが、効果はありませんでした。ちなみ現在のindex.phpは<?php get_header(' '); ?> <div id="masonry-wrap"> <div id="container"> <?php query_posts('posts_per_page=5'); ?> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div class="item "> <a href="<?php the_permalink() ?>" rel="bookmark" title="Permalink a "> <p class="toppoint"><?php the_title(); ?></p> <?php echo the_qf_get_thumb_one('width=200'); ?></a> <?php echo my_excerpt(50); ?> </div> <?php endwhile; endif; ?> <?php wp_reset_query(); ?> </div> </div>
このようになっています。何か方法はありますでしょうか??
フォーラム: 使い方全般
返信が含まれるトピック: トップページの画像と記事を横に並べて表示したい。nobita様
ご指示頂きましてありがとうございます。
指示通り<div class=”item”>をwhile loopの中に書き換えたら横に表示ができました。ただなぜか配置がサイドバーの下に表示されてしまいました。
#wrap{ margin-top: 60px; /* margin-left: 225px; */ } #main{ width: 650px; } #sidebar { float: left; position:relatvie; /* top: 60px; */ /* left: 0px; */ width: 200px; /* height: auto; */ padding: 20px; } #masonry-wrap { float: left; } .container { overflow: hidden; } /* clearfix */ .container:before, .container:after { content: ""; display: table; } .container:after { clear: both; } .item{ width:210px; margin:10px; float:left; background-color:#fff; color:#333333; }
CSSはこのように記述しております。お分かりいただけるかたいらっしゃいましたらお助けいただけると嬉しいです。
フォーラム: 使い方全般
返信が含まれるトピック: QF-GetThumbでサムネイルとタイトルを表示したいフォーラム: 使い方全般
返信が含まれるトピック: フッターとサイドバーが重なってしまう。Orbit様
ご指示ありがとうございます。
私の勉強不足でまだまだ分からない事ばかりのなか、分かりやすい説明をしていただき
誠に有り難うございます。
jQueryを使った方法を試してみたいと思います。
また何か分からない事が有ればご質問させて頂く事もあるかと思いますので宜しくお願い致します。フォーラム: 使い方全般
返信が含まれるトピック: フッターとサイドバーが重なってしまう。Orbit様
お答え頂き有り難うございます。
ご指示あった通りにfloat:left;を追加し
.post{
width: 600px;
position: relatvie;
float: left;
}
.full-width{
float:left;
width: 98% !important;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;固定ページのfloatをnone! important;だったのをleftに変更して固定ページがサイドバーの横に表示されるようになりました。
固定ページのテンプレートにFull-Widthがあるのですが、そのテンプレートを選択するとサイドバーの下に表示されてしまいます。どの部分を変更すれば同じようにサイドバーの横に表示できるのでしょうか?
頭がこんがらがってしまい、どうすればなおるのか分からずお助けいただけたらと。。フォーラム: 使い方全般
返信が含まれるトピック: フッターとサイドバーが重なってしまう。orbit様、お答えありがとうございます。
お答えにあったように書き換えますと、
サイドバーとフッターの配置がうまくサイドバーの下にフッターが配置できました。
そこでまた配置がおかしくなってしまいまして、サイドバーにカスタムメニューを配置しているのですが、カスタムメニューから固定ページを表示すると、今まではサイドバーの横に固定ページの内容が表示されていたのですが、今はサイドバーの横にタイトルは表示されるのですが、
内容がサイドバーの下から表示されるようになってしまいました。
固定ページのphpファイルは<?php
/**
* @package WordPress
* @subpackage Pronto Theme
*/
?>
<?php get_header(); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?><div class=”post clearfix”>
<div class=”entry clearfix”>
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
</div>
<!– END entry –></div>
<!– END post –><?php endwhile; ?>
<?php endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>このようになっています。お分かりになりますでしょうか?
フォーラム: 使い方全般
返信が含まれるトピック: フッターとサイドバーが重なってしまう。返信ありがとうございます。
#footerのpositionですがrelativeに変更しましたが、改善されませんでした。
positionを全て試したんですが、relativeの場合にはサイドバーの左上に重なってしまいます。
fixedの場合は画面の左下に固定されるのですが、サイドバーの下に配置されません。
スクロールすると、左下に固定されたままスクロールします。
absolulteにすると、左下に配置されてサイドバーの下には配置されません。
今の状態としては、#wrap{ margin-top: 60px; margin-left: 225px; } #main{ width: 600px; } #sidebar { position:absolute; top: 60px; left: 0px; width: 180px; height: auto; padding: 20px; } そのもっとしたに #footer{ color: #999; position:absolute; font-size: 11px; bottom: 20px; left: 20px; {
このようになっています。
サイドバーの長さを短くすれば重ならないのですが、サイドバーがスクロールするくらいに長くなるとフッターがサイドバーの下に配置できません。なにか方法があるのでしょうか?
お分かりになる方宜しくお願い致します。