凍結
0 匿名 iPhone
アンケートの投票結果ページで票数を非表示にする方法を教えて下さい。
スタイルシートで見えなく出来るらしいのですが、よく分かりません。
どなたかよろしくお願いします。
02/14 21:25
返信
コメント投稿 検索
4 匿名 iPhone
>>3
詳しくありがとうございます!
あなたのお陰で理想のアンケートを作成する事が出来ました。
本当に感謝致します!
02/25 07:00
返信
3 しち Firefox
>>2
説明するにあたってどうしても必要な単語に関して、先にまとめさせてください。
#◆タグ◆
  <center> <hr> <div> <span> <a> <img> <form> ...
↑のようなものをタグ(正確には“HTMLタグ”)と言います。
なお、
  ##hr## ##enq_title## #fp1_リンク文字# #novel1_リンク文字# ...
といった「#」で挟まれたもの、および
  <nomb> <mobile> <pc> <sp> ...
という「端末別表示のタグ」は、“ALICE+独自タグ”と言います。

#◆CSS(スタイルシート)◆
前回>>1に書いた、「.point{ display:none; }」などのことです。
CSS(Cascading Style Sheets、カスケーディング・スタイル・シート)とはウェブページの見た目を指定するための言語です。「スタイル(見た目)のシート(規則集)」と思ってください。

* どこの{ 何を:どうするのか; }
という文法で書きます。>>1のCSSだったら、
* 得票数の{ 表示形式を:非表示にする }
……みたいな意味合いです。

━━━━━━━━━━━━━━━━━━

> ・1位[選択肢A]
> ・2位[選択肢B]のようにするには
もしかして、得票数だけでなく得票率(○○%)のところも非表示にしたいということでしょうか?
でしたら、
#得票数と得票率を消すCSS
.point, .pcent{ display:none; }

↑と書くことになります。
得票数(○票)だけを消したい場合は>>1のCSSを書き込んでください。

#━━━CSSを書き込める場所━━━
2ヶ所あります。
* (A)【HEAD編集】内〔HEAD間編集〕枠に、<style>〜</style>で書く
* (B)【CSSファイル編集】(機能によって【CSS編集】という表記の場合もありますが、同じ意味です)に書く

このどちらかに入れてください。
どちらに入れた方がいいかは、「すでに使っているCSSがあるか? あったとしたら、どんな記述がされているか?」にもよるので、書き込まれている情報だけだと判断はできません……。
とりあえず【HEAD編集】に入れて、ダメなら【CSSファイル編集】に入れたら良いかと思います。

#(A)――【HEAD編集】への入れ方
>〔HEAD間編集〕の編集枠に
<style type="text/css">
<!--
.point, .pcent{ display:none; }
-->
</style>

と入れます。(上記は得票数&得票率を非表示にするCSSです)
もしもすでに<style>タグが編集枠に入っている状態なら、<style>〜</style>間に『非表示にするCSS』1行のみを挿入してください。

※HEAD間でのCSSの書き方は上掲の他2パターンあります。
 ━━パターン1━━
* <style>
* <!--
   ここにCSS
* -->
* </style>
 ━━パターン2━━
* <style>
   ここにCSS
* </style>

ざっくり言うと記述のシンプルな方が「新しいタイプ(=古いブラウザでの閲覧を考慮しないタイプ)」です。
PC・スマホユーザーだけを閲覧者に想定するなら、一番シンプルなパターン2で良いのですが……。
どんな人がサイトに訪れるか想定できない場合は、最初に挙げた書き方にしておけば大丈夫だと思います。

>※――注意点――※
*●【共通head間編集】を使ってサイトのデザインを行っていた場合は、アンケートページのデザインが変わるかもしれません。
そのときは、【共通head間編集】(←ホームページ編集トップにある『ヘッダー情報など』の項目内にあり)の内容をアンケートページ【HEAD編集】へコピペしてから、『非表示にするCSS』を<style>タグの間に入れてください。
なお、アンケートページの【HEAD編集】を空欄に戻せば、【共通head間編集】のデザインに戻ります。

*●『非表示にするCSS』が効かなかった場合
おそらく、【CSSファイル編集】の方になんらかのCSSが入っていて、それが非表示を無効にしている状態だと考えられます。
その場合は、『非表示にするCSS』をHEADではなく【CSSファイル編集】の方に入れてください↓。


#(B)――【CSSファイル編集】への入れ方
>(1)〔□使用するCSSファイル〕の項目を
 『 下記の内容のCSSを適用 』にする
>(2)非表示にするためのCSSを各編集枠に入れる
 [スマホ用][PC用]のどちらにも入れてください。
 入れたら〔変更〕ボタンを。
>(3)[携帯用]CSS編集にも入れてください。([携帯用]はガラケー用という意味です)
同ページ内に、【□[携帯用]CSS編集】というリンクがありますので、そこから編集枠へ飛びます。
[携帯用]CSS編集ページでも『 下記の内容のCSSを適用 』にして、非表示にするためのCSSを編集枠に書き込み、〔変更〕ボタンを押します。

※ただし、ガラケーで display:none; ができるかはちょっと分かりません……。ガラケーは機種ごとにCSSの実装状況が違いすぎるので。

>※――注意点――※
適用するCSSファイルを変えることになるので、もしかしたらアンケートページのデザインが変わってしまうかもしれません。
ここを何も変更していないなら、もとは『 トップページのCSSを適用 』となっていたはずなので。

そのときは、
*トップページのCSS(ホームページ編集トップにある『ヘッダー情報など』の項目内、【CSSファイル編集】)の内容をアンケートページのCSSファイルにコピペして、そのコピペした内容の下に、件の『得票数等を非表示にするCSS』を書き入れる。

もしもすでに【CSSファイル編集】になんらかの記述をしている場合も同じく、もとからある記述のあとに『非表示にするCSS』を加える形で書き入れてください。
02/24 01:53
返信
2 匿名 iPhone
>>1
回答ありがとうございます!
ちなみに
・1位[選択肢A]
・2位[選択肢B]
上記のようにするには、教えて頂いたタグをどこに書き込めばいいのでしょうか?
無知ですみません…
02/22 07:20
返信
1 しち SOV40
>>0
#CSSに以下を入れる
.point{ display:none; }

↑これで、得票数は非表示になります。



ついでにですが、
>━━━━━━━━━━━━━━━
 投票項目1
 1位 選択肢A 1票 100%
>━━━━━━━━━━━━━━━
↑という投票データは、
↓のHTMLタグ構造になっています。

*  <div class="survey_item">投票項目1</div>
*  <div class="voteResult">
*  <span class="rank">1位 </span>
*  <span class="qtitle">選択肢A</span>
*  <span class="point">1票</span>
*  <span class="pcent">100%</span>
*  </div>

投票データ部分は【投票結果ページ編集】で弄れなくなっているので、余白を作りたいとか行間をあけたいなど、デザインを弄りたい場合はCSS(=スタイルシート)で装飾することになります。
02/21 00:47
返信