サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
ノーベル賞
cunelwork.co.jp
「あ〜、夏も終わるな〜。リキッドレイアウトなんだけどサイドバーの幅は固定でメインコンテンツ幅だけ可変にできないかな〜。」 って思ったこと、皆さんありますよね?夏ですしね。 どうもこんにちは、制作部の崎本です。 固定要素と可変要素が組み合わさるとめんどくさい!通常、cssのプロパティ値はpx, %, em, rem, vw, vhなど単一の単位を以って値の指定をします。 pxで絶対指定したり .hoge { width: 100px; }%などで相対指定したり .hoge { width: 70%; }色々な指定が可能なのは基本のキですよね。 基本的なレイアウトであればこれらの単位指定の使い分けでレスポンシブ対応含め実装可能かと思います。 では、冒頭のような場合はどうでしょうか? 例えば以下のようなレイアウトを想定してみましょう。 コンテンツ全体(#container)最大幅 1000px左
TOP > スタッフブログ > WEB関連 > こいつが最強のWordPressローカル環境構築ツール!?【LOCAL by Flywheel】 ゆーたです。 クーネルワークは現在、WEB広告、通販サイト運営、WEBメディア運営など、様々な事業を扱っていますが… その中でも創業当時から続いている事業が「ホームページ制作」です。 特にWordPressを使ったサイト制作を得意としています。 ホームページ制作 ということで今回はWordPress関連の話題を一つ。 WordPressのローカル環境を構築するには…? WordPressのローカル環境構築といえば、XAMPP(MacではMAMP)や、VCCWといったものが思いつきますが… これらはサーバーやCUIの知識が必要な為、どちらかというとエンジニア向けのツールです。 「デザイナーやディレクターも気軽にローカル環境を構築できたらなぁ…」 そ
こんにちは、keishibukiでございます。 最近「斜め背景をガーッとペンキを塗るような感じでアニメーションさせて!」 という依頼がありました。 それってjavascriptとかゴリゴリに書かないと実装出来ないのでは?と思っていたのですが、思いの外CSSとjQueryの簡単な記述だけで作れました。 かなり簡単なので是非お試しあれ! まずは斜め背景を作ってみよう!下記のような形になります。 HTML<div id="main"> <div class="layer-01"></div> <div class="layer-02"></div> <div class="content-width"> <div class="container"> <h1>コンテンツ</h1> <p class="text">この文章はダミーです。文字の大きさ、量、字間、行間等を確認するために入れています。こ
こんにちは、Webエンジニアの@keishibukiと申します。 8/30〜9/2(前夜祭含め)に開催されたiOSの特大イベントに行って参りました。 みなさんの前で特定のテーマについてお話がしたい!というエンジニア達が応募して、無事選考を通ったエンジニアが発表を行うというイベントです。 なんと弊社からは阿部 優太(@yutaabe200)が、登壇者として選考を通過しました! 弊社としても自社サービスを作る流れが来始めているということもあり、登壇者の阿部、そしてエンジニアの私と取締役の坂井が参加して参りました。 1日目OPENING会場は早稲田大学! 私たちは到着時間が若干遅れてしまったので途中からしかオープニングが見られませんでしたがそのクオリティにはびっくりしてしまいました。 まずはオープニング! 緒方恵美さん! 相変わらず声がカッコいいなー。 スポンサーはプロの声優さんに読んでもらえる
こんばんは。モバイルアプリエンジニアのアベユウタです。 先日弊社で運営しているニュースメディア「新潟永住計画」のiOS・Androidアプリを両方リリースさせていただきました。 「新潟永住計画」のiOS・Androidアプリをリリースしました 無事なんとかリリースに辿り着けたのですが実は私、モバイルアプリエンジニアと言いましたがどちらかと言うとiOS担当なのです。。。 本格的に(1人で)両OSネイティブで開発することは今までになかったので、この機会にアプリに詳しくない方にもiOSとAndroidのそれぞれの違いと、アプリ開発自体の空気感を簡単に知っていただければと思います。 iOSとAndroidとは言うけど「同じアプリなんだから」「そもそも同じスマホじゃん」と言う認識を持たれている方いらっしゃると思います。 少なからず「同じアプリなんだから仕様や要件定義にはさほど手間かからないよね」と言
1年ぶりの登場となってしまいました。ディレクターのTatsuyaです。ディレクターと名乗って約1年、様々な案件に関わることができました。 ディレクター業務の中で、最も難しいことのひとつが、「クライアントとのイメージ共有」です。デザインはもちろんですが、デザインに入る前のワイヤーフレームの段階でイメージの齟齬も生まれやすいと思います。これまでワイヤーフレームといえば、Excelだったり、Cacooだったり、はたまた手書きだったり、試行錯誤して作成していました。 そんな私も含め、世の中の悩めるディレクターのために開発されたと言っても過言ではないのが「Adobe XD」!今回は、私なりのAdobe XDの使い方を紹介しましょう。 Adobe XDとは? Adobe XDとは?と言われると表現が難しいですね。デザインソフトというとPhotoshopやIllustratiorをイメージしてしまうので
こんにちは、keishibukiです。 前回の「脱コピペ!WordPressを使いこなす講座 第一回~Advanced Custom Fields~」から早4ヶ月。久しぶりに更新したいと思います! さて、今回は前回の続きではありません! 先日、svgを本格的に使った(クリックやホバーなどの動作で画像の一部の色を変えたり、動かしたり)サイトを構築しましたので、こちらSVGの基本的な使い方と動的に色を書き換える方法をご紹介致します! SVGの4つの表示方法 <img>のsrcでファイルを読み込む <img src="hoge.svg" alt="hoge"> background-imageプロパティでファイルを読み込む div { background-image: url('hoge.svg'); } htmlにインラインで直接SVGタグを記述する <div> <svg ~~> <!--
こんにちは、制作部のkeishibukiです。 今回のテーマはWordPressプラグインの「WP-PageNavi」。 投稿一覧などで使われるページャー機能(上の画像のようなもの)を 簡単に実装できる便利なプラグインです。 「WP-PageNavi」の簡単な使い方 プラグインのインストール まずは以下の手順でプラグインをインストールしてください。 管理画面>プラグイン>新規追加>「WP-PageNavi」で検索>インストール&有効化 プラグインの使い方 ページャー機能を実装したい箇所(archive.phpなど)に以下のコードを書いてください。 <?php wp_pagenavi(); ?> 出力結果 <div class="wp-pagenavi"> <span class="pages">1 / 4</span> <span class="current">1</span> <a c
オウンドメディアのご提案、戦略立案や、コンテンツ制作などの運用まで 「企業の強み」を活かした、独自性・信頼性のある情報発信をサポートします オウンドメディアの運営を支援します オウンドメディアとは、企業が自社で保有・運営する、インターネットメディアのことです。 「認知度の向上」や「ブランディング」、「新規顧客の開拓」、「リピーターの増加」など、現状の自社のマーケティング課題を解決することを意識しながら、その業界のプロとして、ユーザーにとって有益で、信頼性・独自性のある、質の高い情報発信を目指しましょう。 コンテンツが会社の資産になる! 読者にとって価値のある情報の発信によって、見込客をファン化し、将来の購買行動などに段階的に繋げていく手法をコンテンツマーケティングといいます。 有益なコンテンツを作るのは、非常に手間と時間がかかることですが、一度作ってしまえば継続的に集客のツールとして機能し
リスティング広告とは? リスティング広告とは、GoogleやYahoo!などの検索エンジン上で、検索結果に連動して表示される広告の事です。 広告を表示させたい検索キーワードに対して「入札」をする事で、Google/Yahoo!の検索結果上部にテキスト広告を掲載することが可能になります。 詳しい仕組みは後述しますが、基本的には、入札価格の高い広告から順番に、より上位に掲載されます。 キーワードにもよりますが、現在のGoogle/Yahooの検索結果のファーストビューは、ほとんどがリスティング広告で占められています。 そのため、仮に自分のホームページが、SEOによって検索結果の上位に掲載できていたとしても、リスティング広告を無視することはできない、というのが現状です。 リスティング広告の特徴・メリット リスティング広告を使ったことがない、という方のために、リスティング広告の特徴やメリットを
こんにちは、谷です。 最近ありがたいことに、また多くのメディアに取り上げて頂いています。 1年ほど前までは、身内4人でひっそりと仕事をしていたこともあり、経営者としての自覚なんてまったくなかったんですが、最近は、「社長」として、自分個人にフォーカスして頂くことが多くなりました。 その中で、これまでのことを振り返ったり、漠然と思っていたことを言葉にする機会が何かと多かったので、ちょっとブログにも。 元々、やりたいことなんて何もなかった 昔から、経営者になりたかったんですか?と聞かれることがありますが、正直まったくそんなことは考えたことがなかったです。 なんと言っても「ゆとり第1世代」。特にこれと言って興味のある分野があるわけでもなく、やりたいことや将来の夢、というのが全然無かったです。生まれてこの方、景気が良くなっていったこともないけど、それなりに満たされて育ち、なんとなく生きていたのに、就
どーも。谷です。 最近いくつかのWEBサイト制作案件で、印刷画面のご要望を頂きました。印刷のためだけにページのテンプレートを用意するのも手間なので、簡単に指定範囲のみ印刷できるという噂のjQueryプラグイン「jPrintArea.js」を使ってみました。 何年も前からよく使われているもののようですが、本家サイトからは既に削除されているので、使ってみたい方はこちらのコードをコピーして、「jQuery.jPrintArea.js」と名前をつけて保存してください。 jQuery(document).ready(function($){ $.jPrintArea=function(el){ var iframe=document.createElement('IFRAME'); var doc=null; $(iframe).attr('style','position:absolute;wid
WordPressでjQueryコードが動かない人へ こんにちは。入澤です。 代表曰く「ラーメンブログとなりつつある現況を打破してほしい」ということで、唐突ではありますがWeb(WordPress×jQuery)のお話をしたいと思います。ちなみに私が最近美味しいと思ったカップ麺はマルちゃんのでかまる 濃厚コク塩ワンタン麺です。 さあレッツゴー。 ○が1つ以上の方は読み進めて下さい 1, WordPressテーマファイル「header.php」の「<head>」タグ内にjQueryコードを記述しているが動かない 2, 動かないのはjQueryのバージョンが問題では?と各プラグインコードの直前にjQuery(バージョン違い)を追加している(結果動作したりしなかったり) 3, 「prototype.js」絡みのコードを入れたらjQueryが死んだ 4, 別に今直面している問題はないが、「(Wor
クーネルワークは、「地域社会と共に生きるインターネット企業」として、技術で人と想いをつなぎ、マーケティング×テクノロジー×クリエイティブの総合力で、ローカルビジネスの未来をつくります。
このページを最初にブックマークしてみませんか?
『株式会社クーネルワーク | 新潟 | デザイン&WEBマーケティング』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く