2017-01-01から1年間の記事一覧
XSERVERで契約したサーバーにお名前.comで取得したドメインを設定するには 高速・高機能で定評あるXSERVER を新たに契約しました。 以下、備忘録まで。 手続きの流れ 1. レンタルサーバー契約・ドメイン取得 1.1. XSERVERで契約 1.2. お名前.comでドメインを…
Webマーケティングとは Web(サイトやツールなど)を活用して儲けを生む仕組みを作る集客・販売戦略活動 SEOやリスティング広告など、 Web制作に関わる以上、 日々、Webマーケティングのスキルアップの必要性を感じます。今日は、仕事に活かせそうなWebマーケ…
WordPress 海外テーマ適用時に表示される ??????? の解消方法について WordPressの海外テーマを適用している時、マルチバイトテキストが ??????? となってしまう現象が発生。今日は、この現象の解決方法に関する備忘録です。 原因・解消方法 原因： 原因は、…
＜目次＞ 数字型リストマーカー 標準的な数字タイプ (decimal) 2桁数字タイプ(decimal-leading-zero) ローマ数字[小文字] タイプ(lower-roman) 漢数字タイプ (cjk-ideographic) 数字型リストマーカー 今日は以下のような数字型の箇条書きをマークアップする…
メディアライブラリが表示されなくなった場合の原因・対処法 (admin-ajax.php 編) 「WordPressのメディアライブラリが突然表示されなくなった」 今日は、そんな場合の原因・対処法について、シェアします。※この障害の特徴としては、 メディアライブラリ画面…
パラメータ引き継ぎスクリプト 今日は、現在のページに埋め込まれたリンクから遷移先にジャンプした際、遷移先で遷移元ページURLをパラメータで取得するためのJavaScriptをご紹介します。【目的】 遷移元URL情報が引き継がれているため、 どういった被リンク…
Photshopで枠線(塗りつぶしなし)図形を描く方法 マニュアルの説明書作成時など、 読み込んだ画像の一部に枠線でマーキングする際に使用する方法です。MSペイントでは難なくできるようなことが、慣れないと意外と分からなかったりします。「今さら？」という…
ファイルの更新状況を管理したい時に役立つExcel用マクロ 日々ファイルを作成・更新していると、フォルダ内のファイル更新日時を一覧化したいって思うことが度々あります。が、Windowsのエクスプローラー標準機能には、残念ながらそのような機能はありません…
サイトのお引っ越しが簡単・楽々になるプラグイン 「All-in-One WP Migration」 WordPressのサイト移行って、前はとっても面倒だった記憶があるけど、 今はこんな便利なツールがあるんですね。「All-in-One WP Migration」を使えば、面倒な手間は一切なし。 …
All in One SEO (プラグイン) で設置する場合 [準備] 1. All in One SEOがインストールされていない場合には、まずインストール、有効化します。All in One SEO Pack — WordPress プラグイン : https://ja.wordpress.org/plugins/all-in-one-seo-packja.word…
投稿記事編集画面で標準エディタ(本文)を非表示にする方法 2種 今日は、WordPress管理画面(投稿記事 編集画面)から標準エディタを表示させないようにするための実現方法を検討してみました。 確認した以下2通りの方法について、お伝えします。1) ユーザー権…
5月13日 以下記事の続編です。 times-diary.hatenablog.com Yet Another Mail Merge(Chrome 拡張)で、リマインドメール送信 Google Chrome 拡張機能の「Yet Another Mail Merge」を利用すると、Googleメールから一斉同報メールを簡単に送信することができま…
1. 本システムの機能 ================================= 1). セミナー申し込みフォーム 2). 参加者リスト自動生成 3). 受講票兼自動返信メール作成・送信 4). 関係者宛 受付通知メール送信 5). リマインドメール送信 2. システムの流れ ===================…
カスタム投稿タイプ作成方法 WordPressのカスタム投稿タイプという機能を活用すると、 通常の投稿タイプとは区別して記事を作成・掲載していきたい場合に便利です。 、 カスタム投稿タイプの作成には、以下、「Custom Post Type UI」といった有名で非常に便…
＜目次＞ パスワード認証によるページ閲覧制限方法 1).基本認証による方法 2)、JavaScriptによる方法 パスワード認証によるページ閲覧制限方法 1) 基本認証による方法 2) JavaScriptによる方法 1).基本認証による方法 1).基本認証による方法は、4/7の内容を…
サイトに「.htaccess」ファイルを設置しました。 「.htaccess」とは Webサーバーに設置すると、設置したディレクトリ以下に対して制御することができます。 ※Webサーバーに「Apache」を使用していることが前提「.htaccess」ファイルでできること 主な用途と…
CSS 個別の記事にCSSを設定する カスタムフィールドを活用すると、作成中の記事に独自のスタイルを設定することができます。 WordPressの記事単体に独自のスタイルを設定したい場合、 エディタ内でCSSを書いてもスタイルを設定することはできますが、 これは…
CSS3によるアニメーションボタン No.2 拡大・縮小するアニメーションボタンを作成しました。 Demo css3 アニメーションボタン(拡大・縮小) | WebStock 以下、ソースを記載します。[ソース] html <a href="#"><img class="area-main-topbtnr" src="http://サイト/パス/画像ファイル名" width="100%"></a> ※上記、サイト名、パス、画像ファイル名は適宜変更してくださ…
グローバルナビのテキストをhoverで切り替える方法 グローバルナビにマウスを重ねた時、文字を変更する方法を確認、実装してみました。ここでは、下図のように、 ↓ 標準時英語表記のグローバルナビメニュー ↓ (マウスホバー) ↓ 日本語表記するという動作を実…
今日は、Sass編集時に役立つ、こちらのツールをご紹介させていただきます。 ダウンロード先： http://koala-app.com/ Sass (サス) とは Syntactically Awesome Stylesheets の略だそうです。 一言で言うと、拡張版CSSといったところでしょうか。 CSSが入れ子…
今日は、Bootstrapテンプレートでコーポレートサイト(デモサイト)を作成しました。 使用したのは以下のUNIONというFreeのテンプレートです。 で、作成したデモサイトがこちらです。↓ SAMPLE PRESSこういったテンプレートを利用すると、 シングルページのスタ…
カンバスサイズから画像を指定サイズに加工(縮小) Photoshopの「イメージ」-「カンバスサイズ」から、画像を指定サイズに変更(縮小)する方法です。 【手順】準備： ※この作業時、「選択したレイヤーのバウンディングボックスを表示」はチェックしておいてく…
ヒートマップを利用する 無料でも使えるサービス 自作しようと思う時に参考になる情報 はてなブログユーザーなら使いたいヒートマップツール「Ptengine」 WordPressでヒートマップを使おうと思う時に参考になる情報 ヒートマップを利用する 「ヒートマップ」…
更新日自動入力機能をGoogleスプレッドシートに追加 Googleスプレッドシートは、最近仕事でチーム利用することが多くなりました。今日は、スプレッドシートで管理している表中の値が更新された場合、その更新日を記録したいとのメンバー要望により、該当行に…
ECサイト設置用 CSS3のアニメーションバナー ECサイト設置用にCSS3のアニメーションバナー、 作りました。 ※以下はDemo用ダミーです。Demo 以下、サンプル用のソースを共有します。 <style> /* 基本設定 */ html, body { margin: 0; padding: 0; } body { font-fami…
今日は、新しく作ったサイトに Google Analytics を設置するなどの作業を行っておりました。 Google Analyticsとは 公式サイト： https://analytics.google.comGoogleが提供するアクセス解析ツールのことです。 サイトに導入(※)すると、サイト訪問者の動向・…
スマホサイトでおなじみ、ハンバーガーメニュー 今日は、CSSのみで実装可能、 開閉動作付きハンバーガーメニューを作成しました。 Demo 以下、このたびのソースを公開しておきます。 ソース公開 HTML <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> </meta></meta></head></html>
CSSで右向き三角ボタンを作る transparentを使って下のボタンを作ってみました ECサイトなどに使えそうなボタンです。 備忘録として、ソースを記載します。 [ソース] html <a href="#" class="see_detail">詳細を見る</a> [ソース] css a.see_detail { width: 160px; font-size: 16px; } .see_de…
2017年より、広告代理店勤務、Webデザイナーとして新たな一歩を踏み出しました。 職業訓練校でのWeb制作科卒業後から2年半、 その間はなかなかWebデザイナーとしての就業の機会が得られず、訓練校前と同様、システム開発の仕事に携わっていました。 （Web制…
