エッセンシャルグリッド：詳細な概要とレビュー

ThemePunchは、WordPress用の最も人気のあるプラグインのいくつかを作成します。 Essential Gridは、Slider Revolutionと並んで、ライブラリでトップの収益を上げている企業の1つです。 時が経つにつれて、Essential Gridは、CodeCanyonで最も人気があり、最も成功したプラグインの1つになりました。 そのため、プラグインにハイライトを付けて、サイトを改善できるものかどうかを判断できるようにしたいと思いました。

エッセンシャルグリッド

グリッドプラグインは珍しいことではありません。 実際、私たち自身のDiviビルダーには、この目的に役立つポートフォリオモジュールがあります。 しかし、Essential Gridは、他のほとんどのグリッドプラグインが行っていることをはるかに超えています。そのため、多くのテーマに独自のカスタムグリッドテンプレートが含まれている場合でも、人々は依然としてEGライセンスを毎日購入しています。

元の販売宣伝文を使用するだけで、EGで何ができるかがわかります。

Essential Grid Galleryは、高度にカスタマイズ可能なギャラリーグリッドでさまざまなコンテンツ形式を表示できるようにするWordPressのプレミアムプラグインです。 考えられるアプリケーションは、ポートフォリオ、ブログ、ギャラリー、WooCommerceショップ、価格表、サービス、製品スライダー、Instagram、YouTube、お客様の声など、想像できるあらゆるものに及びます。

しかし、彼らの宣伝文句があなたに教えていないのは、そのカスタマイズがすべて何で構成されているかということです。 それが私たちの仕事であり、私たちはそれを行うつもりです。 それでは、掘り下げて、すべての騒ぎが何であるかを見てみましょう。

入門

まず第一に、これはプレミアムプラグインであることを忘れないでください。 CodeCanyonにアクセスして、27米ドルでダウンロードを入手する必要があります。 次に、手動インストールプロセスを実行します（プラグイン–新規追加–アップロード）。 この時点で、WordPress管理ダッシュボードに3つの新しいアイテムがあります： Ess。 グリッド、パンチフォント、およびEss。 グリッドの例の投稿。 まず、簡単なEssを見てみましょう。 グリッド。

最初のメニュー項目は、アクティベーションコードを入力し、更新や変更ログなどを確認する場所です。 プラグインの使用方法について簡単な説明があります。ショートコードを使用するか、ウィジェットをサイドバーにドラッグします。

このページは、使用したい新しいグリッドを作成する場所でもあるので、そのボタンをクリックすることに慣れてください。

アイテムスキンエディター

Item Skin Editorの下に、EssentialGridに付属するすべての基本的なテンプレートがあります。 これらはスキンごとに編集して、好きなように変更できます。 またはそのまま使用します。 自分でゼロから作成することもできます。

ここで、EGには、さまざまなタイプのグリッドアイテムをタブで並べ替えるオプションがあります。 （間隔、石積みのデザイン、投稿、またはWooCommerce製品グリッドでも。）それぞれにカーソルを合わせると、緑色の歯車アイコンをクリックしてカスタマイズできるタイトル、抜粋、カラーオーバーレイなどがアニメーション化され、表示されます。

このオプションパネル内で、すべての要素を編集できます。 要素間の間隔、表示されるアイコン、アニメーションのスタイルと長さ、リンク、シャドウ、メディアタイプとフィット、すべて。

Essential GridにはCSSクラスがプレーンビューで表示され、好きなように操作できるという事実に注意を向けたいと思います。 何らかの理由でここのオプション内に完璧なデザインオプションが見つからない場合は、カスタムCSSを介して自分で追加できます。

ページの下部に、アクセスできるすべてのレイヤーの鳥瞰図と、現在のスタイル設定が表示されます。

メタデータと検索設定

スキンエディタはおそらくEssentialGridの最も堅牢な個々の部分ですが、EGは他の場所でそれらのオプションを回避しません。 メタデータ処理の下にカスタムメタボックスを作成できます。これにより、プラグインから必要になる可能性のあるカスタム機能のボックスを配置するオプションが提供されます。

[検索設定]でもほぼ同じことができますが、（ご想像のとおり）検索が可能です。 EGは検索結果ページとしても機能するため、通常のアーカイブなどの外観に満足できない場合は、これをすばやく修正するのに最適な方法です。

全体設定

彼らがそう聞こえるように、グローバル設定はあなたのすべての拠点をカバーします。 グリッドを変更および編集できるユーザー、フォントとJavaScriptの読み込み方法、キャッシュの実行方法、アイコンの取得先、グリッド要素のデフォルト画像の設定などの権限を設定できます。 スキンのみのような単一の要素ではなく、プラグイン全体に適用される場合は、ここで見つけることができます。 印象的な部分は、取得するコントロールです。多くのプラグインでは、使用するクエリの種類を選択するオプションがありませんが、EGでは、 get_posts（）またはWP_Query（）がサイトに最適かどうかを選択できます（そうでない場合）。それが何を意味するのかわからないので、デフォルトのままにしておきます。

インポート・エクスポート

プラグインを最初に設定するときは、インポート/エクスポートページを必ず確認してください。 [完全なデモデータのインポート]と[ソーシャルメディアデモグリッドのインポート]をクリックすると、開始できる初期テンプレートの膨大な配列が表示されます。 それらも良いので、ボタンをクリックするだけで、インポート/ダウンロードはほぼ瞬時に行われます。

Essに戻ると、インポートされたグリッドがリストの下部に表示されます。 グリッド。 グリッドの新しいライブラリがそこであなたに会います。

Ess。 グリッドの投稿例

新しい管理メニューオプションの2番目はEssです。 グリッドの例の投稿。 テンプレート化されたグリッドアイテムがおそらく存在する場所であるため、メニュータイトルを作成するのは奇妙な選択です。 ご覧のとおり、このページにリストされているすべての投稿は、実際にはEssの下のグリッド内に含まれているボックスの内容です。 グリッドの概要。

グリッドを表示する投稿またはページで概要ページから取得したショートコードを使用すると、これらはポップアップする個々のアイテムです。

新しいグリッドの投稿を作成するのも簡単です。 他のタイプの新しい投稿を追加するのと同じように機能します。 この見出しの下にある[新規追加]ボタンを押して、パラメータを設定するだけです。

保存されたエッセンシャルグリッドの使用

テンプレートを使用している場合でも、独自に作成している場合でも、テンプレートの使用方法を知っておく必要があります。 すべてがEssentialGridのショートコードを中心に展開しています。 何度も使用したい特定のグリッドがある場合は、[ Ess ]の下の[ Create New EssGrid ]をクリックする必要があります。 管理パネルのグリッドの概要ページ。 内部では、グリッド内のアイテムを並べ替える方法、アイテムの読み込みアニメーション、要素が実際にどこから来ているかなど、すべてを選択し、名前を付けることができます。

名前を付けると、ショートコードエイリアスも選択できます。 そのエイリアスは、EssentialGridショートコードを使用してこの特定のグリッドを呼び出すためにのみ使用されます。 また、将来的に備えて、CSS IDに同じIDを使用することを選択しました。これは、外部の調整を行いたいと思ったためです。

次に、投稿またはページのテキストエディタにショートコードを入力するだけです。

そして出来上がり！

独自のエッセンシャルグリッドの使用

1つのページまたは1つの投稿に何かを表示するだけでよいことがわかっている場合は、まったく新しいグリッドを設定し、そのコンテンツの新しい投稿をテンプレートとして作成し、エイリアスなどを作成するという問題を経験する理由はないかもしれません。それ。 代わりに、投稿エディタ自体から動的ショートコードを生成するだけで済みます。 ツールバーのEssentialGrid ShortcodeCreatorボタンを押すだけです。

次に、このショートコードにレンダリングするコンテンツを指示する手順を実行する必要があります。 概要メニューから事前定義されたものの1つを選択するか（ショートコードを手動でコピーして貼り付ける必要はありません）、表示されたオプションに基づいて独自に作成することができます。

ページを移動して、他の場所にあるものと同じオプション（アニメーション、レイアウトなど）をすべて選択し、準備ができたら、[ショートコードの生成]ボタンを押します。

ご覧のとおり、動的に生成されるショートコードは、グリッド自体に関するすべての情報を保持しているため、はるかに複雑です。

しかし、それがレンダリングされるとき、違いはありません。 特に、作成中にスキンを適用することを選択した場合。

エッセンシャルグリッドウィジェット

最後に、作成したエッセンシャルグリッドをウィジェットに配置するオプションがあります。 これは文字通りドラッグアンドドロップであるため、他のどの方法よりも簡単に設定できます。 [外観]- [ウィジェット]に移動し、[エッセンシャルグリッド]ウィジェットを選択して、レンダリングする場所にドラッグします。 ホームページだけで表示したい場合は、設定するか、作成済みのグリッドを選択できます。 ただし、上記のようにこの方法で動的グリッドを作成することはできません。 これらは事前に生成されている必要があります。

ただし、覚えておくべきことの1つは、すべてのレイアウトがサイドバーで見栄えがよいとは限らないということです。 コンテンツの一部が非常に奇妙にレンダリングされる可能性がありますが、びっくりしないでください。 その場合は、設定を変更して、表示が異なるようにします。フルスクリーンではなくボックスで表示されるか、石積みではなくボックスで表示される場合があります。 思い通りになるまで実験してください。 このためにサイドバー固有のグリッドを作成することをお勧めします。 （元のファイルの代わりに、必要なものを複製して微調整することができます。）

パンチフォント

そして最後に、EssentialGridで得られるカスタマイズの最後のビットがあります。 Punch Fontsは、EGでGoogleFontsを使用するためのシンプルなインターフェースです。 それでおしまい。

タイトルの付いた[新しいフォントの追加]ボタンを押すと、インストールするフォントを選択できます。 モーダルのリンクをGoogleFontsにたどると、必要なパラメーターが見つかり、プラグインがフォントをサイトにプルします。

また、 tpmonikerが内部使用のみであると表示されている場合、それは基本的に以前のエイリアスと同じであることを意味します。 フォントを物事に適用しているときにそれがわかります。 したがって、適切な名前を付けてください。

最終的な考え

全体として、Essential Gridは、最も堅牢で強力なグリッドプラグインの1つです。 Slider Revolutionを使用したことがある場合は、レイアウトとレイヤーがそれと非常によく似ており、自宅にいるように感じるはずです。 そうでない場合は、どの部分が組み合わされているかを理解するときに、少し学習曲線が生じる可能性があります。 しかし、一度実行すると、本当に美しいページを作成できるようになります。

このレベルのカスタマイズが必要ない場合は、プレミアム価格を支払う必要がない場合があります。 あなたのニーズに合うかもしれない他のグリッドプラグインがたくさんあります。 さらに、グリッドの重さによっては、サイトの速度が問題になる可能性があります。 つまり、ロードアニメーションをカスタマイズできるのには理由があります。

ただし、必要かつ正しく実行された場合、プラグインは本当に輝いています。 エッセンシャルグリッドがそのカテゴリーでナンバーワンの売り手である理由があります。 また、評価とサポートスレッドを確認すると、ThemePunchはすぐに返信してサポートします。

したがって、27ドルで、おそらく入場料の価値があります。 さらに、テーマデザイナーの場合は、拡張ライセンスを購入して、独自のテーマのパックインとして含めることができます。 これはかなりクールです。

Essential Gridを使用していますか？ コメントであなたの作品のいくつかを見てみましょう！

Bloomicon /shutterstock.comによる記事特集画像