Category:Design

Q＆A/デザイン・CSS†

主なFAQ
PukiWikiのデザインやスキンの変更、CSSについてよくある質問

下記のページも参考にしてください。

↑

メニュー（Menubar）†

↑

Q.　MenuBarが表示されない†

A.　MenuBarというページ（1.4 系では、pukiwiki.ini.php の$menubar で設定したページ）を作成していますか？
このページがない場合は、MenuBarが表示される部分が空白になってしまいます。

↑

Q.　左サイドに表示される内容を変更したい†

A.　左サイドに表示される内容は、MenuBarというページ（1.4 系では、pukiwiki.ini.php の$menubar で設定したページ）の内容そのものです。（menu プラグインで切り替えていない場合）
そのページを編集することで、表示される内容を変えることができます。

表示の整形ルールに関しては、FormattingRules, プラグインマニュアル, Q＆A/使い方 などをご覧ください。

↑

Q.　サイドバーにある最新の20件を消してしまいました†

A.　recentプラグインを記述した行を表示したい位置に追記してください。

#recent(20)

Reference 質問箱4/135

↑

Q.　FrontPageのみ左サイドにサブメニューをつけたい†

A.

  • PukiWiki 1.3系の場合 
    if($vars['page'] == 'FrontPage')
    のような判定で振り分ければOKだと思います。
    pukiwiki.skin.ja.phpの60行あたりに以下のように追加してみて下さい。 
    +<?php if($vars['page'] == 'FrontPage'){ ?>
<td valign="top" style="width:120px;word-break:break-all;">
<?php echo convert_html(@join('',@file(get_filename(encode('MenuBar'))))) ?>
</td>
<td style="width:10px">
</td>
+<? php } ?>
  • PukiWiki 1.4系の場合
    pukiwiki.skin.ja.php(pukiwiki.skin.php) の110行目あたりを以下みたいな感じに 
    <?php if (arg_check('read') and exist_plugin_convert('menu') 
and $_page == 'FrontPage') { ?>
    あるいは、MenuBarというページを作らない事にして(強制したいなら削除した後に編集認証をかけて)、menuプラグインのサブメニューの機能を利用しましょう。(デフォルトでは無効)
  • version 1.4.7の場合
    skin/pukiwiki.skin.phpの169行 
    <?php if (arg_check('read') && exist_plugin_convert('menu')) { ?>
    を 
    <?php if (arg_check('read') && exist_plugin_convert('menu') 
&& $_page === 'FrontPage') { ?>
    とする。pukiwiki.ini.php で$defaultpage をFrontPage 以外に設定している場合は、 
    <?php if (arg_check('read') && exist_plugin_convert('menu') 
&& $_page === $defaultpage) { ?>
    とした方が便利。（変更するたびにスキンを修正する必要がなくなる）
↑

Q.　MenuBarの幅を変更したい†

A.　 skin/pukiwiki.skin.ja.php の60行目あたりにMenuBar のテーブルのスタイル定義

td.menubar{width:135px;}
div#menubar{width:130px;}

があるのでこの部分を変更すればサイズを変更できます。

＊1.4.5 以降では、「skin/pukiwiki.css.php」が編集対象になるファイルになります。

変更場所は356行目辺りから始まる div#menubar の width値 です。

div#menubar {
<?php   if ($media == 'print') { ?>
	display:none;
<?php   } else { ?>
	width:9em;
↑

Q.　MenuBarを2つ設置したい†

A.　サイトの左側だけ出なく、右側にもMenuBarを設置したい場合は、RightBarというページ（1.5.3では、pukiwiki.ini.php の$rightbar_name で設定したページ）を作成して下さい。
1.5.2以前ではdev:BugTrack/430のページを参考にして下さい。

↑

Q.　ページ右側にもMenuBar(RightBar)がほしい†

A.　RightBarというページ（1.5.3では、pukiwiki.ini.php の$rightbar_name で設定したページ）を作成して下さい。
1.5.2以前ではdev:BugTrack/430, 続・質問箱/21のページを参考にして下さい。

↑

Q.　編集や検索ページの全てのページにMenubarを表示させたい†

A.　こちらのページを参考にして下さい。
dev:PukiWiki/1.4/ちょっと便利に/編集や検索ページでも常にMenubarを表示する

↑

Q.　ページを階層化していない状態で、includesubmenuプラグインのようにMenuBarの表示内容を切り替えたい†

A.　通常のメニューと切り替えたいページにmenuプラグインを設置して、引数に切り替えたいページを指定してください。

↑

Q.　menubarのスクロールを独立させたい†

Reference 質問箱4/181

↑

編集ページ†

↑

Q.　編集ページのボタンの位置を変えたいのですが†

A.　lib/html.phpの編集ページに関する部分を変更してください。

↑

Q.　編集時のテキストボックスの大きさを変えたい†

A.　default.ini.php　の以下の部分を変更してください。

// テキストエリアのカラム数
$cols = 60;
// テキストエリアの行数
$rows = 25;
↑

ページ†

↑

Q.　検索フォームをページ中に指定したい†

A.　プラグインの「#search」を使うことで検索フォームを作ることが出来ます。 また「#lookup(検索,ケンサク)　と　InterWikiName」を組み合わせて擬似検索フォームを作ることができます。

例　#lookup(検索,サイト内を検索)
　　#lookup(Google,Googleで外部サイトを検索)

注意: 1.4.5 以降のPukiWiki はデフォルトで、GET メソッドでの検索を禁止する設定になっています。この状態では、InterWikiName を組み合わせてPukiWiki の検索をする方法がうまく働かなくなります（search プラグインを呼び出すだけになる）。

↑

Q.　文字や見出しの横や下についている記号や矢印(↑, †, ?)を変更したい（消したい）†

A.　各言語設定ファイル（ja.lng.php, en.lng.php）の
$_msg_content_back_to_top, $_symbol_anchor, $_symbol_noexists を修正してください。

$_msg_content_back_to_top = '<div class="jumpmenu"><a href="#navigator">&uarr;</a></div>';
$_msg_word           = 'これらのキーワードがハイライトされています：';

///////////////////////////////////////
// Symbols
$_symbol_anchor   = '&dagger;';
$_symbol_noexists = '?';

$_symbol_anchor はaname プラグインを通して表示しているので、その制約を受けます。空文字を設定したい場合は、質問箱3/37 を参照してください。

なお、&uarr; は↑ を、&dagger; は† を意味するHTML エンティティです。

↑

スキン†

↑

Q.　PukiWikiのロゴの画像を自分のサイトで使いたい†

Q.続き
PukiWiki-officialのロゴ画像を自サイトのPukiWikiで使いたいのですが、使用許諾またはガイドラインなどは何処かに書いてありますか？

A.　リンク画像については、PukiWiki-official及びPukiWiki開発サイトへのリンク用の画像としてご自由にお使いください。画像はできるだけご自分のサイトにコピーしてお使いください。なお、他の用途には使わないでください。

↑

Q.　PukiWikiの公式サイトのスキン・CSSを公開して欲しい†

A.　PukiWiki-official/仕様のページを参考にして下さい。またPukiWiki-official及び開発サイトで使用しているスキンは、リリース版やcvs版のスキンとは別物で、それぞれのサイトでカスタマイズしたものを使用しています。開発サイトで使用しているスキンは、開発サイトのページデザインで公開されています(但し、2002年8月時点のものなので、そのままでは使えません)。

↑

Q.　ある所で見たスキンを手に入れたい†

A.そのページの管理人さんに問い合わせてください。また、使用条件などにもご注意ください。
参考.自作スキン

↑

Q.　印刷用ページの出力や対応スキンについて†

A.　印刷用スキンに関してはこちらのページをご覧下さい。

↑

Q.　スキンにあるmetaのrobots、NOINDEX,NOFOLLOWはいったいなに†

A.　skin/pukiwiki.skin.ja.php(pukiwiki.skin.php) の

<?php if (!$is_read) { ?>
<meta name="robots" content="NOINDEX,NOFOLLOW" />
<?php } ?>

この部分は、編集画面などを検索エンジンに登録させないために、編集画面などをロボットに巡回させないための設定になっています。

↑

Q.　Last-modifiedの書式を日本語書式に変更したい†

A.　表示される内容を変更する場合は、skin/pukiwiki.skin.php(pukiwiki.skin.php) の270行辺りの以下の部分を修正してください。

<?php if ($lastmodified != '') { ?>
<div id="lastmodified">Last-modified: ←ここ
<?php echo $lastmodified ?></div>
<?php } ?>

日付などの順番の変更は、pukiwiki.ini.phpの280行辺りの以下の部分を修正してください。

// Date format
$date_format = 'Y-m-d'; 
// Time format
$time_format = 'H:i:s';
↑

Q.　ページのタイトルの下にあるURLを表示させたくない†

A.　skin/pukiwiki.skin.phpの20行目当たりにある以下の部分を変更すると、
リロード用のURL 表示（http://pukiwiki.sourceforge.jp/?Q%EF%BC%86A%2F%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%BBCSS ）から、
topicpath プラグインを用いた階層構造のユーザーインターフェース表示になります（Top / Q & A / デザイン・CSS のような表示）。

// SKIN_DEFAULT_DISABLE_TOPICPATH
//   1 = Show reload URL
//   0 = Show topicpath
if (! defined('SKIN_DEFAULT_DISABLE_TOPICPATH'))
	define('SKIN_DEFAULT_DISABLE_TOPICPATH', 1); // 1, 0

それすらも表示したくない場合は skin/pukiwiki.skin.phpの

<?php if ($is_page) { ?>
 <?php if(SKIN_DEFAULT_DISABLE_TOPICPATH) { ?>
   <a href="<?php echo $link['reload'] ?>">
   <span class="small"><?php echo $link['reload'] ?></span></a>
 <?php } else { ?>
   <span class="small">
   <?php require_once(PLUGIN_DIR . 'topicpath.inc.php'); 
    echo plugin_topicpath_inline(); ?>
   </span>
 <?php } ?>
<?php } ?>

の箇所を消去します。

↑

Q.　ページ下の関連リンク(Link:)の表示を消したい†

A.　default.ini.php の $related_link の値を 0 にしてください。

↑

Q.　ページ下（フッター部）にある添付一覧(添付ファイル:)の表示方法を変更したい†

A.　ページに添付された一覧をフッター部に表示[非表示]にするには や、フッター部の添付一覧の表示方法を変更するには の各Q＆A をご覧ください。

↑

Q.　プラグインcounterやonlineをスキンに直接埋め込みたい†

A.スキン自体にonlineを埋め込む場合は、skin/pukiwiki.skin.ja.php(pukiwiki.skin.php) に

<?php if (is_page(':online')) { ?>
<?php echo convert_html(get_source(':online')) ?>
<?php } ?>

を記述してください。なお、counterの埋め込みは無理のようです。see 質問箱/7

簡単な方法は、MenuBarにプラグインcounterやonlineを記述すれば全ページでカウントを行うことが出来ます。以下をMenuBarに入れると便利です。

RIGHT:today:&color(green){&counter(today);};
RIGHT:yesterday:&color(green){&counter(yesterday);};
RIGHT:total:&color(green){&counter;};
RIGHT:online:&color(green){&online;};

Reference 質問箱4/159

↑

Q.　スキンで直接プラグインを使用したい†

Reference 質問箱3/144

↑

Q.　ブログパーツを埋め込んで表示させたい†

Reference 質問箱4/201

↑

Q.　recent の 表示文章を画像にしたい†

A.　ja.lng.phpの$_recent_plugin_frameを変更する。 plugin/recent.ing.php最期のほうにある

return sprintf($_recent_plugin_frame, count($lines), $items);

で'%d' をcount($lines) に、 '%s' を$items に置き換えています。 画像に数字を入れたなどで件数のテキストが不要な場合

return sprintf($_recent_plugin_frame, $items);

と count($lines)を消すとともに$_recent_plugin_frameの中の'%d'も消して下さい 詳しくはPHP関数:sprintfを参照して下さい。

Reference 質問箱4/70

↑

Q.　左上トップのリンク先を変更したい†

Q.続き
トップへのURLからページ名部分を外して短くしたい（SEOのために統一したい）

A.　lib/html.php の $_LINK['top'] = ～～～; を変更する。
トップの割り当てを別のページに変更するには、Q.　トップページ（FrontPage）を別のページに変更したいを参考にしてください。

Reference 質問箱4/67

↑

Q.　タイトル下のURLを固定したい†

Q.続き
タイトル下のURLの?以降をなくしたい(index.phpで止めたい)

Reference 質問箱4/133

↑

Q.　ページ下のtoolbarのアイコンをテキストリンクにしたい†

A.　pukiwiki.skin.phpとja.lng.phpを編集します。

Reference 質問箱4/55

↑

Q.　左上ロゴや右下toolbarアイコンの画像を変更†

A.　pukiwiki.skin.phpを編集します。

Reference 質問箱4/75

↑

CSS†

↑

Q.　CSSの内容が表示に反映されない†

A.　PukiWikiでは1つのファイルで複数のケースに対応するため、CSSファイル内の一部にPHPが使用されています。ブラウザから直接CSSファイルにアクセスし、エラーなど他の内容が表示されて違うContent-Typeヘッダになっていないかを確認してください。

↑

Q.　リンクの色を変えたい†

A.　リンクの色を変更するときは、skin/pukiwiki.css.phpの下記の部分を変更してください。

a:link { color:#215dc6; }
↑

Q.　見出しの表示色を変更したい†

A.　skin/pukiwiki.css.phpの以下の部分を変更してください。

h1, h2 { background-color:#999; }
↑

Q.　リスト構造における「+」のインライン要素の表示方法を変更したい†

A.　続・質問箱/3

↑

Q.　サイドバーでリスト構造が機能しない†

A.pukiwiki.css.phpのdiv#menubar ul{～～～～～～}の部分です。cssを好みに変更してください

↑

Q.　横方向のスクロールバーを出ないようにサイトのページ幅を調節するには†

A.　整形済みテキストなどで横スクロールバーが出て見難くならないようにしたい場合は、skin/pukiwiki.css.phpのCSSに以下のプロパティを追加すればよいでしょう。

pre {overflow:auto;}
↑

Q.　スタイルシートを個別に指定したい†

A.　個別のページごとにスタイルシートをしたい場合は以下のプラグインを利用してください。

↑

Q.　表組み（テーブル）自体の位置をページの右寄せ、左寄せ、中央寄せに変えたい（個別に指定したい）†

A.　サイト全体の表示ルールを変更するなら、CSSの設定を調整して下さい。（1.4.7 の例が、質問箱4/13にあります）
個別に指定したい場合は、改造する必要があります。
詳しくは、dev:PukiWiki/1.4/ちょっと便利に/テーブルの中央寄せor右寄せを参照して下さい。

Reference 質問箱3/199, 質問箱3/214, 質問箱3/440, 質問箱4/13, 質問箱4/76, 質問箱4/218, 質問箱4/227

↑

Q.　カレンダーの横にテキストを回り込ませる方法は？†

A.　カレンダーを包んでいるdiv(またはtable)タグのCSSにfloat:leftを設定してください。

↑

Q.　凍結ページの背景色を設定したい†

A.　続・質問箱/17

↑

Q.　PukiWiki で使っている、CSS のclass 名やid 名を知りたい†

A.　dev:PukiWiki/CSSのclass一覧 を参考にしてください。

トップ   編集 凍結 差分 履歴 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2020-11-18 (水) 20:59:52
Site admin: PukiWiki Development Team

PukiWiki 1.5.4+ © 2001-2022 PukiWiki Development Team. Powered by PHP 8.2.12. HTML convert time: 1.267 sec.

SourceForge