WordPress オリジナルテーマの作り方
2013年12月25日 Wordpress WordPressのオリジナルテーマの作り方について説明していきます。慣れると簡単なのですが、初心者には少し難しいWordpressのカスタムデザイン。Wordpressのテーマがどのように動くのか、スタティックのHTMLテンプレートにどうやってWordpressの機能をつけるのかを説明していきます。PHPの知識は必要ありませんが（もちろんあった方が楽ですが）、自分でデザインをするためのPhotoshopとCSSの知識は必要です。前回に引き続き、Nick La氏によるWeb Designer Wallを参照しています。 ↑私が10年以上利用している会計ソフト！ ※これはWordpress旧バージョンのオリジナルテーマの作り方です。最新版Wordpressを使用してのオリジナルテーマの作り方は「WordPress オリジナルテーマの作り方 3.0+
YUKI HARUYAMA Portfolio Site | 春山 有由希
春山 有由希 / ハルヤマ ユウキ UX / UI Design HTML / CSS Graphic Design Photography Designer & Front-end developer 福岡でプログラマとして就職後、Web制作会社に転職し、デザイナーになりました。 ECサイト、テレビ局や番組サイトのデザイン、執筆や講師業などで経験を積んだのち上京し、株式会社Fablicで フリマアプリ フリル（現ラクマ）のUI/UXデザインを担当。 その後、楽天株式会社でデザインチームマネージャを担当したのち、 フリーランスのデザイナーを経て、現在は株式会社スマートバンクでデザイナーをしています。 MORE PROFILE
Webデザインの1pxを作るためのPhotoshopのレイヤースタイルいろいろ
色んな Webサイトを見ていると、1px にこだわって作られたキレイなデザインがたくさんあります。私は Photoshop を使っているので、Photoshop のレイヤースタイルを使って、1px の細かい所を作る Tips をまとめてみました。基本的な操作ばかりなので、これから Photoshop で Webデザインをやってみたいなーという人向けの記事です。 色んな素敵なデザインの Webサイトを観察していると、1px の細かいところまでこだわって作られてるデザインってとても多いですよね。1px … Webデザインでは一番小さいサイズ。「神は細部に宿る」という言葉もあるけれど、1px までしっかり作られたグラフィックはとても美しいですね！ 今回は Photoshop を使って、いろんな 1px を作ってみました。とは言っても難しいグラフィックデザインを作るわけではなくて、レイヤースタイル
なんとなくCSSを使っている人が，CSS中級者になるために （「崩れないレイアウト」のセオリー） - 主に言語とシステム開発に関して
CSSを「なんとなく」知っていて，「なんとなく」使っている， というケースがある。 そういう場合，思わぬところでレイアウトが崩れ， 要素の正確なポジショニングができず， 「なんとなく」ずっと悩み続けることになる。 その原因は，CSSの中級のノウハウが足りない，という点にある。 一発で正確なレイアウトができるようになろう。 そうなれば，CSS中級者だ。 以下は，CSS中級者になるためのノウハウ。 （１） 要素の分類 （１−１） インライン要素とブロック要素 （１−２） 置換インライン要素と非置換インライン要素 （２） 正確なポジショニング （２−１） positionのrelative/absoluteの使い方 （２−２） DOCTYPEスイッチによるボックスモデルの解釈方法の違い （２−３） 要素内の高さ位置と，要素の高さ （２−４） floatの崩れない使い方 （３） 正確なテーブルレイ
JavaScriptで読み込むCSSファイルをまるっと[7korobi8oki.com]
代表中山陽平 ブログ「苦手意識を無くせばWeb活用はうまくいく」弊社では「がんばる中小企業」のWeb活用をサポートしています。今の時代、第3者である、制作会社や代理店におまかせでは勝てません。同じような商品・サービスが溢れる中、選んでもらうためのコンセプトを立て、それを実現するためにネットもリアルも総動員しながら戦う必要があります。 みなさんが世の中に・自社の従業員に実現したい幸せや提供価値を、しっかりと実現していくためには、みなさん自身が主役になり、私達のような専門会社が側面支援するのがベストです。 このブログでは御社が中心となってウェブ活用できるヒントを配信しています。お悩みの方はお気軽に問い合わせフォームからご相談ください。 最新の記事一覧
![JavaScriptで読み込むCSSファイルをまるっと[7korobi8oki.com]](https://cdn-ak-scissors.b.st-hatena.com/image/square/e43158a9b02ff4438d55128491865b833395bd4d/height=288;version=1;width=512/https%3A%2F%2Froundup-inc.co.jp%2Fwp-content%2Fuploads%2F2019%2F09%2F9106fa4d7b0fdf2534aa97dea102e186.png)
photoshop- 1ピクセルラインで質感を高めるテクニック - WEBデザイン BLOG
下記の画像はこのサイトのトップページの画像です。両者の違いは、1ピクセルのラインが入っているか、いないかの違いです。左の画像はピクセルラインあり、右側はラインなしです。（画像クリックすると原寸表示されます。） ピクセルラインを入れることで、立体感を演出することができ、さらに質感を高めることができます。 さらに拡大した画像も下記の画像をクリックすることでご覧いただけます。
WordPressを入れたらやっておきたい3つのwp-config設定。 - とりあえず9JP？
WordPressのドキュメント見てたら、（個人的に）不便だと思っていた点をフォロー出来る便利な設定等が載っていたので紹介してみる。 WordPressのコメント削除とか、記事削除、とか、Ajaxで非常に軽快に削除出来てしまうので、「ついうっかり」の保険の意味でゴミ箱機能は欲しいけど、ゴミ箱に入ってから削除に至るまでの日数がデフォルトの30日はやや長めな気がするので、wp-configで define('EMPTY_TRASH_DAYS', 2 ); 2日に設定。（「やや」じゃないね。） ちなみにこの値を0にすると、ゴミ箱機能を使用しない設定になる。 WordPressの編集履歴機能、非常に高機能で良いのだけど、デフォルトだとかなりの数を保存してくれちゃって無駄に容量が増えていく。 正直、ちょっとウザいので、制限する。 wp-configで define('WP_POST_REVISION
YUI 2: Reset CSS
YUI Reset CSS The foundational YUI Reset CSS file removes and neutralizes the inconsistent default styling of HTML elements, creating a level playing field across A-grade browsers and providing a sound foundation upon which you can explicitly declare your intentions. Note: YUI Base CSS (introduced in version 2.3.0) can compliment Reset by applying a style foundation for common HTML elements that i
The Man in Blue > Experiments > footerStickAlt
Experiment footerStickAlt Date created 25 August, 2005 Date last modified 29 August, 2005 Discussion Visit the discussion The examples linked from this page expand upon a technique published by solarDreamStudios called footerStick, that allows for the footer of a Web page to appear either at the bottom of the browser window or the bottom of the Web page content – whichever is visually lowest. Beca
SlickMap CSS: A Visual Sitemapping Tool for Web Developers | Astuteo
Slickmap CSS is a simple stylesheet for displaying finished site maps directly from HTML unordered list navigation. It's suitable for most web sites – accommodating up to four levels of page navigation and additional utility links – and can easily be customized to meet your own individual needs, branding, or style preferences. Features and Benefits Eliminates the need for additional softwarePlan s
第1回 CSSサポートが不十分なIE 6でサイトの表示品質を保証する
2008年8月設立。アクセシビリティ，ユーザービリティ，CMSの導入，SEO/SEMといったWebサイト制作から，ROIを意識したブランディング，ソーシャルメディアを用いたユーザーとのコミュニケーションの最適化など，マーケティング活動までを手がけるクリエイティブユニット。 2009年3月18日にInternet Exploler（以下IE）8が米国で正式公開されました。日本語版も同月20日からダウンロード可能になり，多くの制作者が実際に触れてみたことでしょう。しかし，それから4カ月が経とうとしている現在でもIE 8へのアップグレードはスムーズに行われていないようです。 筆者がアクセス解析を見た範囲では，IEのシェアが全体の85～95％前後，さらにIEの中では6と7が約45％前後，8のシェアが10％弱ということろです（7月6日時点）（表1）。
CSSの実装状況で変わるボックスのデザイン方法
Web制作において、対応しなくてはいけないブラウザの中には、未だしぶとくIE6が残っています。IE6が2001年に登場したことを考えると、もう8年もその時代の「縛り」を(健気に)守りながら作っていることになるんですね。 いま良く使われているCSSのテクニックも、ほとんどはこの「縛り」の範囲内で有効な手法なわけですから、突然2001年にタイムスリップしてサイトを作る事になったとしても、今も昔も変わらない１つの古文書に従えばいいので、きっと活躍できます。 しかしたまらん、流石に疲れた。 ボックスひとつができること CSSでは、文書を構成する各要素は、ボックスという矩形領域に置きかえられ、それらの持つプロパティを操作して装飾します。つまり、ボックスはページデザインを構成する最小単位と言えるわけですね。 そこで今回は、最小単位となる1つのボックスに対して、どのような装飾手法が有効かという点を、CS
[CSS]リスト要素を使用したスタイルシートの5つのトリック
ul, ol, dl要素を使用したスタイルシートの5つのトリックをPieter Beulqueから紹介します。 <textarea name="code" class="html" cols="60" rows="5"> <ol> <li><span>Lorem ipsum dolor ... elit.</span></li> <li><span>Aliquam ... eu risus.</span></li> <li><span>Vestibulum ... neque.</span></li> <li><span>Lorem ipsum dolor ... elit.</span></li> <li><span>Aliquam ... eu risus.</span></li> <li><span>Vestibulum ... neque.</span></li> </ol> </
できた！をかなえるチュートリアルマガジン DEKIMAGA（デキマガ）
より持続可能で思いやりのある世界を追求する中で、植物ベースの食事がグリーンリビング運動の極めて重要な側面として浮上しています。 動物性食品よりも果物、野菜、穀物、ナッツ、種子を優先するこの食生活の変化は、単なるトレンドではなく、環境、健康、倫理に大きなメリットをもたらす、深いライフスタイルの選択です。 植物ベースの食事を採用することが環境に配慮した生活の基礎である理由と、それがどのようにして世界中に前向きな変化の波及効果をもたらすことができるのかを詳しく見てみましょう。 地球にとっての勝利 植物ベースの食事に関する環境問題には説得力があります。 農業、特に肉や乳製品の生産は、温室効果ガスの排出、森林破壊、水の枯渇、生物多様性の損失の主な原因となっています。 植物ベースの食品を選択することで、環境への影響を大幅に削減します。 植物は動物製品と比べて生産に必要な土地、水、エネルギーが少なくて済
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Subtle CSS3 Typography that you’d Swear was Made in Photoshop | Envato Tuts+
%26utm_content%3DGoogle%2520Reader)
css-lecture.com
ウェブ制作に便利そうなチートシート16選 | IDEA*IDEA
467 + Ajax/Javascript/Dhtml examples and demos to download
Restyle the web with Stylish