ぼくのサーバ移転：WP（WordPress）移行篇 - 小窓屋めがね
2. WordPressデータベースのバックアップ 前に、Wordpress2.8へ自動アップグレードしようとして、華麗に失敗した苦い経験があるので、バックアップは入念に行う。MySQLのバージョンアップを行う前に、まずはバックアップ。面倒くさくてもバックアップ。なにはともあれ、バックアップです。 WordPressの管理画面からもバックアップできるけど、プラグインの設定が引き継げないので、「phpMyAdmin」で行う。 実際の作業は下記サイトを参考にさせてもらいました。 （参考） データベースのバックアップ - WordPress Codex 日本語版 http://wpdocs.sourceforge.jp/データベースのバックアップ WordPressのサーバー移転メモ：バックアップ編 | コリス http://coliss.com/articles/blog/wordpress/
WordPressで使える知ってると便利な13のSQL文 | Web活メモ帳
WordPressでデータベースの情報を変更する際に便利なTipsが載っている13 Useful WordPress SQL Queries You Wish You Knew Earlierというエントリーのご紹介。 WordPressはMySQLというデータベースで動いていますが、何かを変更したい場合に結構困る事があります。 例えば ・パスワードを忘れて管理用のメールアドレスも忘れた場合 ・テスト用にレンタルサーバーのサブドメインで動かしていて、いざ本ドメインで表示されるよう設定してもサブドメインにリダイレクトされるとか。画像がでない。とか。 全ての情報がデータベースに格納されているためしょうが無い部分もあるのですが、困った時に知っておくと便利なTipsです。 ※必ずバックアップを取ってから実行してください。 サイトのURLを変更する ワードプレスはサイトのURLとホームのURLを絶対
大曲さんが作られた「WordPressで挿入する画像のsrcを相対リンクにする【発展版】」をプラグイン化 | khoshinoのライフログ
そのようなわけで、ライフログを取るにあたって、色々と初めの仕組み作りをしているわけですが、 ブログをWordPressで書こうとする場合、画像を添付する時は、画像の挿入リンクは、絶対リンクになる仕様です。 例えば、 <img src="http://khoshino.com/wp-content/uploads/2011/10/abc.jpg" /> となります。 この場合、例えば、ローカル環境や構築環境で作ったサイトを、本番用のドメインで公開する場合、画像を既に多くアップロードしている場合には、この画像のドメイン部分のURLを置換する必要があります。 また、既に運営しているサイトを、何かの事情でドメインを移行する場合にも、同様に、この画像のドメイン部分のURLを置換する必要が生じるでしょう。 以上のような理由から、WordPressで挿入する画像のsrcを相対リンクにする需要がある
WordPressで挿入する画像のsrcを相対リンクにする – Simple Colors
WordPressで記事の中に画像を挿入するとき、通常ではhttp://www.example.com/wp-content/uploads/～ などといったように、ドメインを含んだアドレスがimgタグのsrcとして埋め込まれてしまいます。 例えば、ローカル環境や構築環境で作ったサイトを、本番用のドメインで公開する場合、このドメイン部分をいちいち置換しなくてはなりません。 MySQLが分かる方であれば、一括置換すれば済む話ではありますが、データベースってなんじゃらほいという方はどうすればいいのか困りますよね。そこで、挿入される画像のsrcにドメイン部分が入らないようにする方法を紹介します。 利用しているテーマのfunctions.phpに下記コードを追加するだけ。 CODE 1 function delete_host_from_attachment_url( $url ) { $rege
スタイルシート［CSS］/テキスト・フォント/要素の前後に内容を追加する - TAG index
:before と :after について :before … 要素の直前に対する指定 :after … 要素の直後に対する指定 :before と :after に関する詳細は、疑似要素の指定をご覧ください。 追加する内容 ここでは3種類の値を説明しています。（この他に、引用符を挿入することもできます） 文字列を追加する 文字列を追加する場合は、追加したい文字列を次のような形式で指定します。（文字列を引用符で囲みます） content: "追加するテキスト"; 例えば、p要素の直前に文字列を追加したい場合は、次のような指定内容になります。 p:before { content: "追加するテキスト"; } 文字列の中に引用符を入れたい場合は、次のようにバックスラッシュ（ \ ）でエスケープしておきます。 content: "追加する\"テキスト"; 画像等を追加する 画像等を追加する場合
Selectors Level 3
Selectors Level 3 W3C Recommendation 06 November 2018 This version: https://www.w3.org/TR/2018/REC-selectors-3-20181106/ Latest version: https://www.w3.org/TR/selectors-3/ Previous version: https://www.w3.org/TR/2018/PR-selectors-3-20180911/ Latest version of Selectors: https://www.w3.org/TR/selectors/ Editor's Draft https://drafts.csswg.org/selectors-3/ Feedback: File an issue on GitHub Editors:
CSS セレクタに関するおさらい 2 | WWW WATCH
前回の続きです。今回も引き続き、CSS3 で定義予定のものも含めて、CSS セレクタのリファレンスいきます。 今回は擬似クラスを中心に取り上げてみますが、CSS3 では擬似クラスが大幅に拡張されていますので、見慣れないものばかりかと思いますが、知っておくといいかもしれません。ただし、ブラウザのサポートはまだまだですので、実用性は高くないと思います。 擬似クラス (Structural pseudo-classes) E:root ドキュメント内のルート要素である E という要素にスタイルを指定します。CSS3 で定義。(X)HTML においては、ルート要素は html 要素になるので、 :root { margin:0; padding:0; } とすれば html 要素にスタイルが適用されます。XML の場合は、DTD で指定されたルート要素に対して適用されます。 E:nth-child
スマートフォンサイトのHTMLコーディングメモ12個 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
display:table-cell; を活用する リキッドレイアウトのコーディングにすごく便利。 親要素に display:table; 子要素に display:table-cell; 記事リストなど、画像とテキストを横並びにするときに。 均等に横並びにしたいときに。 タップ時のカラー設定 CSSで以下のように設定。アルファ値も設定可能。 -webkit-tap-highlight-color: rgba(255,105,183,0.6); 画像、iframeに max-width を指定 img・iframeは、サイズが大きすぎて画面からはみ出すことがあるので max-width:100%; を指定する。 word-break:break-all; を指定 スマホは幅が狭いため、長いURLなどが1行に入りきりません。 word-break:break-all; を適宜指定する。 フォ
【Lightbox2】表示画像のサイズをブラウザに合わせて自動化する 知識Ｚ（ゼータ）
キレイで便利なlightbox2ですが、画像そのものが大きいとブラウザをはみ出てしまうのが盲点でした。 http://lokeshdhakar.com/projects/lightbox2/ lightbox.js: preloader.onload = function() { $image.attr('src', _this.album[_this.currentImageIndex].link); $image.width = preloader.width; $image.height = preloader.height; return _this.sizeContainer(preloader.width, preloader.height); }; preloader.onload = function() { $image.attr('src', _this.album[_
レスポンシブな時代に必要なWebディレクターの7つの心得
先日、僕の恩師のウェブ制作会社で開催された勉強会で「レスポンシブWebデザインのワークフロー」についてお話させていただいたんですが、その際に「意思決定層との密なコミュニケーションをとり、スムーズに開発を進めていくために、苦労した点や工夫した点」について質問をいただきました。その回答をまとめたので、このブログでも共有したいと思います。今回まとめたものはレスポンシブWebデザインでの制作に特化した内容ではないですが、以下に挙げるようなWebディレクターとしての基礎知識やスキルが、レスポンシブWebデザインのような柔軟な対応を強いられる制作では大切になると感じています。 Question: 意思決定層との密なコミュニケーションをとり、スムーズに開発を進めていくために、苦労した点や工夫した点を教えてください。 Answer: どれもディレクターとして基本的な内容になりますが、僕は以下のようなことを
nth-child() 疑似クラスを試してみる | d-spica
nth-child() 疑似クラスを試してみる 2008-05-26 0 0 XHTML/CSS CSS, nth-child CSS3で定義される nth-child() 疑似クラス。これが使えるようになると，HTMLファイル，CSSファイルのメンテナスが楽になるだろうな...と思うのです。 どんな具合か，ちょっと試してみました。 nth-child() 疑似クラスとは 英文ですが，詳細は以下から。W3Cの Working Draft（草案）ですので，今後変更されることがあるかもしれません。 Selectors - 6.6.5. Structural pseudo-classes - :nth-child() pseudo-class その要素が何番目の子要素かによって，該当するものにだけ，CSSをあてることができます。 たとえば，セレクタにul li:nth-child(2n)，または
bloggerで特定ラベルの投稿一覧を出す
追記2：この記事の方法は、ひとつのラベルに記事が150本以上あるとそれ以上表示しません。それ以上にも対応したversion2を作成済みですので(新しい記事)、そちらをご使用ください。 ・ Blogger ブログにサイトマップ - ラベル分類された投稿一覧を「ページ」に表示する方法 なんてのが紹介されていた。これはかなり便利。 でも、自分の場合は特定のラベルがついた記事だけの一覧を作りたい。で、Kuriboさんのページの2個目のscriptタグ(feed呼ぶとこ)のパラメータでラベル制限してみたんだけど、ラベルが複数付いている記事があるとラベルの見出しも増えてしまいうまくいかなかったので、元のjsを参考にして自分でjs書いてみた。 それを使ったサンプルページはここ 使い方は、Blogger の管理画面「ページ」から新しいページを作りhtml編集モードにして <script src="http
Sketchを買ったら読んでおきたい！基本的なことからちょっとした小技、ショートカットまとめ | Goodpatch Blog
つい最近までSketchは日本であまり知られておらず、日本語でSketchについて書いている記事はほとんどありませんでした。ところが5月7日にFireworksの開発終了が発表され、代替ツールとしてSketchの名前が急浮上。それに合わせたのかSketchが5月8日に半額セールを行い、Sketchについて書かれた記事やツイートも増えてきて、注目度の高まりが感じられます。とはいえ英語日本語問わず、Adobe製品に比べたら圧倒的に情報量が少ないSketch。Adobe製品と同じような機能やショートカットも多いですが、使いこなせるようになるまでは少し時間が掛かりそうです。Goodpatchでもマニュアルや記事を読みながら、隙間時間にSketchを触ってその機能を確かめています。というわけで今回は、Sketchの基本的な機能や、発見した小技、ショートカットなどをまとめてみました。 先日アップした「
「PhotoshopによるWebデザインカンプ制作はFireworksに比べて効率が悪い」という都市伝説について
2013/5/7に、Adobe Fireworks の事実上の開発終了が発表されました。 ただし、「バグ修正やセキュリティ関連のアップデートは継続する」とのことですが、いつまでも使い続けられることを保証するものではないので、Fireworks ユーザーの方はそう遠くないうちに別のアプリケーションに乗り換える必要があると思います。 Adobe、Web画像ツール「Fireworks」終了へ – ITmedia ニュース 移行先アプリケーションの候補の1つである Photoshop について、Twitterを見ていると「Photoshop でのWebデザインは制作効率が悪い」という方が多いようですが、私はそんなことはないと思っています。 なぜそう言えるのかについて、簡単にまとめてみました。 目次 FireworksとPhotoshop、それぞれのメリットとデメリット なぜ「Photoshopは効
Webサイト高速化に必要なHTTPの仕組みを理解する （1/4）：CodeZine
はじめに こんにちは、クラスメソッド株式会社でWebを担当している野中です。これから身につけるWebサイト高速化テクニック第2回目です。 第1回の「Webサイト高速化対策の現状」は読んでいただけましたか？「Webサイト高速化対策の現状」では高速化対策がなぜ必要なのかを紹介しているので、この回を読む前にぜひ読んでおいてください。 今回は、Webサイトの高速化に大きく関係するHTTPについて復習したいと思います。高速化対策と言ってもWebサイトが遅延する原因はさまざまです。 読み込むファイル数が多いことやサーバー側の処理に時間がかかっている、またはエンドユーザーが利用しているネットワークが原因かもしれません。 ところが原因を探っていくと、Webサイトが遅くなってしまう要因の多くにHTTPが関係しています。 実際の高速化手法も大事ですが、事前知識としてHTTPについて知っておきましょう。 対象読
日本語版 WordPress チートシート | Webクリエイターボックス
2024年7月21日 Wordpress, ダウンロード WordPressの覚え書きというか、カンニングペーパーです。コードなんぞをまとめました。他にもWordPressのチートシートはいたるところで記事にされていますが、CSSハックやCSS小技集に続き、これもまた自分用まとめだったり…。例文も私がよく使うものをコピペしやすいように置いてます。A4サイズの印刷用も作ってみたので、「これ使えるかも！」と思った方は印刷してデスクに置いておくと便利です :) ↑私が10年以上利用している会計ソフト！ WordPressチートシート 目次 印刷用WordPressチートシート WordPressテンプレートファイル インクルードタグ テンプレートタグ テンプレートタグ/bloginfo 条件分岐タグ ループ ナビゲーションメニュー 1. 印刷用WordPressチートシート A4サイズの印刷用P
wp-config.phpファイルの設定いろいろ | コリス
WordPressをインストールしたことのある人は、「wp-config.php」ファイルにデータベースやシークレットキー、言語などを設定したことがあるでしょう。 これらの設定はもちろん大切ですが、他にも有用な設定がいろいろできるので紹介します。 10+ wp-config tricks to boost your WordPress site 下記は各ポイントを意訳したものです。 「wp-config.php」設定の前に FTPのパスワードの入力を省略 FTPの情報を保持 テーマやプラグインの編集エディタの使用禁止 スパムコメントのゴミ箱を自動で空に WordPressの引越しに役立つテクニック WordPressのメモリの上限を変更 データベースの自動修復 エラーメッセージを非表示に 管理画面はSSLでアクセス 外部からのリクエストをブロック ウェブサイトのURLを定義 自動保存の間隔
【jQuery】画像・テキストが切り替わるアニメーション
Wir erschaffen digitale Relevanz. Wir sind die Medienfreunde, eine smarte inhabergeführte Design- und Digitalagentur im Süden von Leipzig. Seit 2004 konzipieren, gestalten und entwickeln wir nutzerzentrierte Websites sowie webbasierte Anwendungen für das digitale Heute und Morgen – optimiert für Suchmaschinen, Performance und einen geringen CO₂-Fußabdruck. So entstehen zeitgemäße, bedarfsgerechte
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
html5-memo.com
nemousu.com