■ユーザーズフォーラム リニューアルのお知らせ
新規投稿は新ユーザーズフォーラムにお願いします。

ブログTOPにスライド画像を表示させると、ブログの本文(single.php)だけ表示が乱れてしまいます。

Masamichi > ブログTOPにスライド画像を表示させると、ブログの本文(single.php)だけ表示が乱れてしまいます。 @ 2014/2/6 13:29
いつもお世話になっております。

皆さまのお陰で、ようやくサイトがカタチになってきたのですが、
新たな問題に直面しましたので、投稿させて頂きますm(_ _)m

◆環境

■Ecologyテーマ(バージョン:Ecology2.0 v0.7)
■ BaserCMSのバージョン:2.1.2
■ レンタルサーバー名: heteml
■ スマートURLの利用: [OFF]
■ 設置フォルダ: [http://ooo.com/]
■ 利用しているデータベース:  [MySQL5.6]
■ PHPスキル 初心者


◆原因となる作業

こちらの記事で実装しました
レイアウトファイルを【ブログの基本設定】に読み込むと発生する。

元のファイルに戻すと画像は表示されないが、
記事は正しく表示されます。

・固定ページにヘッダー画像を表示させる方法

下記に詳細を書かせて頂きます。


◆症状

ブログの記事本文のページだけ表示がおかしくなる

・記事一覧、アーカイブ、カテゴリのページは、問題なく表示されています。


ブログのテンプレート内の single.php が、
それに該当するかと思うのですが・・・


これらのファイル(single ・ index ・ archive)も下記の記事を参考に
同仕様にさせて頂いております。

→ ブログの【概要】【本文】の表示について


◆問題のページはこちらです。

→ 記事本文が潰れてしまいます。


現在の single.php はこの様になっております。


<?php
/**
 * ブログ詳細ページ
 */
$bcBaser->css('colorbox/colorbox', null, null, false);
$bcBaser->js('jquery.colorbox-min', false);
$bcBaser->setDescription($blog->getTitle().'|'.$blog->getPostContent($post,false,false,50));
$blog->editPost($post['BlogPost']['blog_content_id'],$post['BlogPost']['id']);
?>

<script type="text/javascript">
$(function(){
	if($("a[rel='colorbox']").colorbox) $("a[rel='colorbox']").colorbox({transition:"fade"});
});
</script>

<h2 class="contents-head" style="padding-bottom:20px;">
<?php $bcBaser->img('tb_news.png',array('alt'=>'新着情報','width'=>'712px','height'=>'40px')) ?></h2>
<h3 class="contents-head" style="padding-left:15px;">
	<?php $bcBaser->contentsTitle() ?>
</h3>

<div class="post">
<?php $blog->postContent($post) ?>
	<div class="meta"> <span>
		<?php $blog->category($post) ?>
		&nbsp;
		<?php $blog->postDate($post,"Y年m月d日") ?>
		&nbsp;
		<?php $blog->author($post) ?>
		</span> </div>
	<?php $bcBaser->element('blog_tag', array('post' => $post)) ?>
</div>
<div id="contentsNavi">
	<?php $blog->prevLink($post) ?>
	&nbsp;|&nbsp;
	<?php $blog->nextLink($post) ?>
</div>
<?php $bcBaser->element('blog_comments') ?>



■読み込ませているレイアウトファイルです。

色付けしている部分を削除しております。


<?php
/**
 * デフォルトレイアウト
 */
?>
<?php $bcBaser->xmlHeader() ?>
<?php $bcBaser->docType() ?>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<?php $bcBaser->charset() ?>
<?php $bcBaser->title() ?>
<?php $bcBaser->metaDescription() ?>
<?php $bcBaser->metaKeywords() ?>
<?php $bcBaser->icon() ?>
<?php $bcBaser->rss('ニュースリリース RSS 2.0', '/news/index.rss') ?>
<?php $bcBaser->css('style') ?>
<?php if($bcBaser->isTop()): ?>
<?php $bcBaser->css('style1') ?>
<?php $bcBaser->css('bxslider') ?>
<?php endif; ?>
<?php $bcBaser->css(array('layout')) ?>
<?php $bcBaser->js(array(
	'jquery-1.4.4.min',
	'jquery.easing',
	'jquery.colorbox-min',
	'script',
	'rollover',
	'jquery.bxSlider',
	'startup')) ?>
<?php $bcBaser->scripts() ?>
<?php $bcBaser->element('google_analytics') ?>
</head>
<?php $bcBaser->func() ?>
<body id="<?php echo $bcBaser->getContentsName(true) ?>">
<?php $bcBaser->element('header') ?>
<div id="Page">
<?php if($bcBaser->isTop()): ?>
	<?php $bcBaser->element('MainSlider') ?>
<?php endif; ?>
	<div id="Wrap" class="clearfix">

<div id="Alfa">

<div id="ContentsBody" class="clearfix">

<?php $bcBaser->flash() ?>

<?php if(!$bcBaser->isTop()): ?>
<div style="padding-left:5px;">
<?php endif; ?>
				<?php $bcBaser->content() ?>
<?php if(!$bcBaser->isTop()): ?>
</div>
<?php endif; ?>

<?php if($bcBaser->isTop()): ?>
				<?php $bcBaser->element('bxslider') ?>
<?php endif; ?>
				<?php $bcBaser->element('contents_navi') ?>
			</div>
		</div>

		<div id="Beta">
		<!-- SideBar -->
		<div id="SideBar">
			
			<div id="SideBox">
		<?php $bcBaser->element('sidebox') ?>
			<div class="link">
			<?php $bcBaser->element('widget_area',array('no'=>$widgetArea)) ?>
			</div>
		</div>
		<!-- end SideBar -->
		</div>
		
	</div>

	<div class="to-top"> <a href="#Page"><img src="http://perrotta-kitchen.com/images/totop.png"></a> </div>

</div>
	<?php $bcBaser->element('footer') ?>
<?php echo $cakeDebug; ?>
<?php if($bcBaser->isTop()): ?>
</div>
<?php endif; ?>
</body>
</html>


*メインスライダー画像を全ページで表示させたい事と、
bxsliderを任意の場所で表示させたいので、
この様にしております。


大変長くて誠に申し訳ないのですが、
解決方法がありましたら、
どうぞよろしくお願い致します。


■ BaserCMS: 3.0.15〜4.1.5
■ サーバー名: mixhost・x-server・さくら・ロリポップ
■ スマートURLの利用: [共に]
■ 設置フォルダ: [共に]
■ データーベース MySQL5.6
■ PHPスキル[C]

Masamichi > Re: ブログTOPにスライド画像を表示させると、ブログの本文(single.php)だけ表示が乱れてしまいます。 @ 2014/2/7 13:32
お世話になっております。

自己解決致しましたので、
ご報告させて頂きますm(_ _)m

ブログのレイアウトにスライダー画像を使うと、
表示が乱れてましたので、レイアウトファイルを見直すことにしました。


◆結論的には、レイアウトファイル内のヘッダー内の記述の順番を
入れ替えることで直りました。

読み込ませる順番で、プラグインが動かないことがあるのを、
ふと思い出しました。


■実際の手順
1.ブログが正しく表示される状態のレイアウトファイルを用意(default)
(ブログの基本設定から読み込ませる)

2.スライダー画像を呼び出す記述を任意の場所に設置(ブログの状態を確認)

3.画像は表示されるが、スライダーの表示が乱れる(ブログは正常)

4.CSS1(スライダー用のCSS)の順番を、2の直前に変更。

5.PCではスライダーもブログの記事も正しく表示されるが、
スマートフォンでブログが見れなくなった。
http://◯◯◯.com/index.php/s/news は、このサーバーにありませんというエラー)

また、同様にお問い合わせページ(contact)も表示できなくなった。(スマホ版のみ)

6.両方共にスクリプトを使用しているので、それぞれの優先順位を考慮して
レイアウトファイル内の順番を並び替える(PC・スマホで確認しながら)

7.ようやく、双方共に正しく表示される順番を発見し、保存して作業終了。

上記となりました。

新たなプラグインやjQueryを使ったスクリプトを導入する際は、
僕の様なトラブルに見舞われることがあるかもしれませんので、
参考になれば幸いです。


貴重な時間を使って考えて下さったみなさま、
誠にありがとうございました。

今後共どうぞよろしくお願い致します。

■ BaserCMS: 3.0.15〜4.1.5
■ サーバー名: mixhost・x-server・さくら・ロリポップ
■ スマートURLの利用: [共に]
■ 設置フォルダ: [共に]
■ データーベース MySQL5.6
■ PHPスキル[C]

ログイン
ユーザー名:
パスワード:


  新規登録 / パスワード紛失

検索

facebook
フォーラムで悩みが解決した場合など、よかったら「いいね!」をポチっとクリックしてください!質問の回答者や開発者の励みになります

フォーラムガイド


関連リンク

オンライン状況
13 人のユーザが現在オンラインです。 (8 人のユーザが フォーラム を参照しています。)

登録ユーザ: 0
ゲスト: 13