2013-01-01から1年間の記事一覧
ウィジェットを配置する ウィジェット (Widget)とは、 グラフィカルユーザインタフェースを構成する部品要素、およびその集まり 「外観」→「ウィジェット」 最近の投稿を変更する 複数のウィジェットを配置する 注意 macのブラウザでカラム落ちがある場合、…
カスタムメニューを作成する 「外観」→「メニュー」をクリックする 「メニューの名前」を「menu」として作成する 固定ページをメニューに追加する カテゴリをメニューに追加する メニューの並び順を変更する ヘッダーメニューとフッターメニューを作成 新規…
投稿のカテゴリを作成する 「投稿」→「カテゴリ」リンクから初期設定の「未分類」を「お知らせ」に変更する カテゴリを新規作成 「スタッフブログ：blog」 「お客様紹介：client」 「メディア掲載：media」 サブカテゴリを作成 スタッフブログにサブカテゴリ…
固定ページを編集する 「編集」リンクから編集画面に移動する 編集ツールをすべて表示 画像を挿入 編集画面の「メディアを追加」ボタンを押す メディアを挿入 更新して表示 表組みを挿入 プラグイン「MCE Table Buttons」をインストール GoogleMapを挿入 プ…
新規固定ページを追加する 固定ページは、時系列で一覧表示させる必要のないページにむいています 「パーマリンク」を編集する 固定ページを公開する 固定ページを表示 「ホーム」「トピックス」「ギャラリー」「会社概要」「よくある質問」「サイトマップ」…
テーマファイルをダウンロード テーマは画像やスタイルシートなど一式を含んだテーマファイルから構成されている インストールされたテーマの保存場所「/wp-content/themes/」 参考書テーマ テーマファイルをアップロード 「ダッシュボード」→「外観」→「テ…
メディア設定 テーマにあわせて配置できる画像サイズの幅の上限が660pxにします アップロード可能なファイル容量は、サーバーによって異なります（変更するには、サーバーの php.ini を編集します） 画像のリサイズ設定 アップロードした画像を自動でリサイ…
WordPressにログイン http://localhost/wp/wp-login.php 一般設定 表示設定 特にオンライン制作環境では、制作途中の状態を検索エンジンがインデックスしたり、外部の人に見られないようにするには、以下のチェックをします ログインしないと閲覧ができない…
WordPressをダウンロード WordPress 日本語ローカルサイトからダウンロードする テストサーバーにインストール テストサーバー内「htdocs」にwordpressフォルダー（例は、wp）を移動する phpMyAdminからテストサーバー内に入り「wordpress（例は、wp）」とい…
ログイン情報をログアウトするまで保持 以下のように表示する仕組みを記述しなさい 未入力チェック機能をつける HTML5のフォーム機能 PHPでの未入力チェック 正規表現で入力文字列をチェック IDは、半角英字 パスワードは、半角数字 重複防止は考慮しない
訪問回数を表示する 以下のように訪問回数を表示する仕組みを記述しなさい 《はじめて訪問の場合》
入力されたIDを次回アクセス時まで覚える仕組み IDを２週間記憶するように記述しなさい（戻るリンクで戻ったときに、記憶しているようにする） ただし、パスワードはセキュリティの観点から覚えさせないこと 《input.php》 《output.php》
フォーム（5） 課題（4）でデータベースに格納されたデータを一覧表示させなさい（名前、メールアドレス、メッセージ内容）
フォーム（4） 課題（3）の内容を、データベースに格納するように設計しなさい
フォーム（3） 課題（2）の内容を、クライアントと入力者にそれぞれ入力内容をメールの送信をするようにしなさい
フォーム（2） 課題（1）の内容を、入力フィールドの入力チェックをPHPで加えなさい 入力チェックのレベルは、未入力チェック → 正規表現チェック と自力で入力可能な選択をします
フォーム（1） 入力チェックは、HTML5フォーム機能のみ（Safariは機能しません。） 入力画面 → 確認画面 → 完了画面 まで値が遷移できていればOK メールは、クライアントにのみ送信する 解答は、ブログ等に載せないこと（アップロード後アドレスをメールする…
jQueryでフィルタ（フィルタリング）機能 《index.html》 <html lang="ja"> <head> <meta charset="UTF-8"> <title>jQuery Filtering</title> <link rel="stylesheet" href="css/style.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script src="js/filtering.js"></link></meta></head></html>
Parallax（パララックス効果） マウスにあわせて画像が3D的に追従するサイトを簡単に作れるjQuery jParallaxプラグイン スクロールに応じて要素がアニメーションする、視差効果（見た目がずれる） カメラ用語：ファインダーから見た映像と撮影結果にずれがあ…
jQuery Masonry フローティングブロック：リキッド <html lang="ja"> <head> <meta charset="UTF-8"> <title>フローティングブロック</title> <link rel="stylesheet" href="css/style.css"> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="js/jquery.easing.1.3.js"></script> </link></meta></head></html>
ポラロイド風写真配置 ブラウザによっては、傾きが表示されない場合があります。（CSS3で設定） 再読み込みで配置される位置が変わり、プレスドラッグで動かすことができます。 <html lang="ja"> <head> <meta charset="UTF-8"> <title>ポラロイド風ギャラリー</title> <link href="css/style.css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> </link></meta></head></html>
FadeChange 素材 横スライド サンプルデモ <html lang="ja"> <head> <meta charset="UTF-8"> <style> /*表示修飾*/ * { font-family: Verdana, Geneva, sans-serif; margin:0; padding: 0; } body { margin: 0; text-shadow:1px 1px 2px #f0f0f0; } h1 { font-size: 28px; margin: 15px 0 0 0; } .nav { backgro</meta></head></html>…
コメントの管理機能を作成（２） 閲覧者のコメントに返信や投稿するための投稿画面を作成する 新規ファイルを作成 「comment」フォルダー内に「input.php」というファイルを作成します admin/index.phpを編集 「admin」フォルダー内に「index.php」を編集し…
コメントの管理機能を作成（１） 閲覧者のコメントを管理する画面を作成します フォルダーとファイルを作成 「admin」フォルダー内に「comment」というフォルダーを作成します 「comment」フォルダー内に「index.php」というファイルを作成します コメント一…
コメントのメールアドレス部分をリンクにする コメントに入力してあるアドレスをクリックするとコメントした人にメールが送れるようにしてみます 「topic.php」を編集 「comment_list_name」を選択する この時点で「# ヌルリンク」を設定します。 emailの設…
画面にコメントを反映させる 「topic.php」を編集 「バインディング」→「レコードセット（クエリー）」を選択する 名前：comment_list 接続：MyBlogDatabase テーブル：commnet_table フィルター：entry_id「URLパラメータ：entry_id」 ソート：comment_id「…
コメント機能を作成 コメント機能を作る データベースに新規テーブルを作成 「my_blog」内にテーブル名「comment_table」を作成する フィールド数：7 実行後、以下のように入力します 「topic.php」を編集 「サーバービヘイビア」→「レコードの挿入」を選択…
前後のページへ移動する機能を作成 ページング機能を作る 《HTML》 <p class="nav"><a href="#"><<前のページへ</a> <a href="#">次のページへ>></a></p> 《CSS》 .nav { text-align: center; margin: 20px 0 0 0; } 次のページへ 「次のページへ>>」を選択する 「サーバービヘイビア」→「レコードセ…
記事画面を作成 「topic.php」を作成 <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>記事画…</meta></head></html>
トップの一覧と詳細を作成 サイトトップページ「index.php」を作成します 基本構造のみとします <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>
