Re: 検索ブロックの文字と検索窓の縦並びを 横並びにしたい。
2014年4月7日 at 20:53
CSSでの対応方法は、隊長のアドバイス通り、display: inline; でいいと思います。
適用方法:
1. 編集モードで変更したい検索ブロックのメニューを開き、「デザイン」を選択
2. 「CSS」タブの「CSSクラス名」に「inline-search-form」と入れで保存しましょう(クラス名は何でもいいです)
3. ページの「設定」ウィンドウを開き、「カスタム属性」タブから「追加ヘッダー要素」を選択。中に下記のCSSを記述して保存しましょう。
<style type="text/css">
.inline-search-form h3 { display: inline; }
</style>
サイト全体に適用したい場合は、テーマのCSSを変更した方がいいですね。とりいそぎ

Re: 検索ブロックの文字と検索窓の縦並びを 横並びにしたい。
2014年4月8日 at 23:23
仮でページを作って、検索ブロックを表示して、追加ヘッダー要素を設定し、見せていただくことは可能ですか?
Re: 検索ブロックの文字と検索窓の縦並びを 横並びにしたい。
2014年4月11日 at 5:22
hissyさん、返信ありがとうございます。
◆今回のテストは 下記の http://www.hattoriwood.jp/ を丸ごとコピーしたサイトで検証しています。
丸コピサイトで、下記のページに真っ白になった状態を再現しました。
http://0304.coredayo.net/others/search/
該当ページの管理画面の 追加ヘッダー要素 の画像も載せておきます。
◆このサイトでは失敗しましたが、同じく、concrete5 - 5.6.1.2 から concrete5 - 5.6.2.1 にアップグレードした、製作途中の下記のサイトでは、御指導のとおりの内容で 横並びに成功しています。
http://marianz.com/search/
◆サイトの規模が全然違うのですが、両方とも、プレーンヨーグルトを改変していて、スタイルシート以外は、ほぼ、同じような作りになっています。
ソースを見ましたが、良く判りませんでした。 宜しくお願いします。
◆今回のテストは 下記の http://www.hattoriwood.jp/ を丸ごとコピーしたサイトで検証しています。
丸コピサイトで、下記のページに真っ白になった状態を再現しました。
http://0304.coredayo.net/others/search/
該当ページの管理画面の 追加ヘッダー要素 の画像も載せておきます。
◆このサイトでは失敗しましたが、同じく、concrete5 - 5.6.1.2 から concrete5 - 5.6.2.1 にアップグレードした、製作途中の下記のサイトでは、御指導のとおりの内容で 横並びに成功しています。
http://marianz.com/search/
◆サイトの規模が全然違うのですが、両方とも、プレーンヨーグルトを改変していて、スタイルシート以外は、ほぼ、同じような作りになっています。
ソースを見ましたが、良く判りませんでした。 宜しくお願いします。
添付:
20140411.jpg
Re: 検索ブロックの文字と検索窓の縦並びを 横並びにしたい。
2014年4月11日 at 7:08
ソースを見ると、下記のようになっていました。styleタグの閉じタグがうまく閉じられていません。
このフォーラムからコピペしたのが良くなかったのかもしれません。同じ内容をヘッダー要素にタイプして入力することで正しく表示できると思います。
<style type="text/css">
.inline-search-form h3 { display: inline; } </style>
このフォーラムからコピペしたのが良くなかったのかもしれません。同じ内容をヘッダー要素にタイプして入力することで正しく表示できると思います。
Re: Re: 検索ブロックの文字と検索窓の縦並びを 横並びにしたい。
2014年4月11日 at 14:12
hissyさん、いつもありがとうございます。
御指導のとおりでした、上手くできました。
http://0304.coredayo.net/others/search/
ところで、サイト全体に反映させようとして、テーマの main.css 入れても反応しないので、
header.php に入れたら上手くできました。これでよいでしょうか?
それと、240ページあるのですが、検索ブロックのメニューを開き、「デザイン」の追加を、一ページずつしないといけないんですよね?
ほとんどの検索窓がスタックの検索窓から作られているので、文字と同様に、インスタンスされていると思い、スタックの検索ブロックのメニューからデザインを変更してみましたが、他のページは、反応はしませんでした。
240ページをなるべく早く変更できる方法がありましたら、ヒントを下さい。
御指導のとおりでした、上手くできました。
http://0304.coredayo.net/others/search/
ところで、サイト全体に反映させようとして、テーマの main.css 入れても反応しないので、
header.php に入れたら上手くできました。これでよいでしょうか?
それと、240ページあるのですが、検索ブロックのメニューを開き、「デザイン」の追加を、一ページずつしないといけないんですよね?
ほとんどの検索窓がスタックの検索窓から作られているので、文字と同様に、インスタンスされていると思い、スタックの検索ブロックのメニューからデザインを変更してみましたが、他のページは、反応はしませんでした。
240ページをなるべく早く変更できる方法がありましたら、ヒントを下さい。
Re: 検索ブロックの文字と検索窓の縦並びを 横並びにしたい。
2014年4月11日 at 15:06
サイト全体にCSSを追加するには、管理画面の「テーマ」のページで「カスタマイズ」ボタンをクリックして表示される画面で、「CSSを追加」の欄に記載するのが便利です。ただし、テーマがカスタマイズに対応していることが条件なので、お使いのテーマに「CSSを追加」欄がない場合もあります。CSSはキャッシュされているので、キャッシュのクリアが必要です。管理画面から「キャッシュのクリア」を実行してみてください。
Your post has been saved and will be published after approval by the forum moderator.
kerama
Re: 検索ブロックの文字と検索窓の縦並びを 横並びにしたい。
早速試してみましたが、どうも、うまくいきません。
1. 編集モードで変更したい検索ブロックのメニューを開き、「デザイン」を選択
2. 「CSS」タブの「CSSクラス名」に「inline-search-form」と入れで保存
(その他の項目・・CSS ID: や 追加CSS: は空白のまま)
3. ページの「設定」ウィンドウを開き、「カスタム属性」タブから「追加ヘッダー要素」を選択。中に上記のCSSを記述して保存
追加ヘッダー要素に記入して、「この編集を公開」ボタンを押したところで、そのページだけ、画面がエラー表示も何も無い真っ白になってしまいます。
真っ白で何も出来ないので、トップページに戻って、管理画面から、「追加ヘッダー要素」から、先ほどのタグを削除したら、元にもどりました。
同じ事を3回トライして、同じ結果です。
「追加ヘッダー要素」ではなく、main.css に記述しても同じく真っ白で同じ結果です。
なにか、いけない事をしたのでしょうか?