Have ideas to improve npm?Join in the discussion! »

wp-widgetify

1.0.0 • Public • Published

wp-widgetify

The Widgetify WordPress Plugin is a collection of WordPress widgets designed to help web designers build sections of their web page easily via widgets.

NPM

You can install directly via NPM to your project folder.

npm install wp-widgetify

Usage

Once installed, log into your WordPress admin dashboard and head over to the Widgets section of your Widgetify theme. You should see all the available widgets for your usage. The following are a list of the standard widgetify widgets available for your use and their functions (to see more on specific use case, refer to documentation):

  • Widgetify Banner
    The banner helps you create a banner with a background picture that cuts across the full width of the screen.

  • Widgetify Blog Group
    The blog group helps you create a blog group in two variants (portrait & landscape).

  • Widgetify Contact Form
    The contact form helps you create a basic contact form that submits to an email.

  • Widgetify Content Box
    The content box helps you create a content area with title, text and associated image.

  • Widgetify Gallery
    The gallery helps you create a collection of pictures with a slideshow to help the user browse through.

  • Widgetify Google Map
    The google map helps you add the classic google map into your website easily by specifying an address.

  • Widgetify HTML Container
    The HTML container helps you add raw HTML code into your page by adding its widget to your page.

  • Widgetify Icon Group
    The icon group helps you add a set of (font-awesome, themify) icon columns into your page.

  • Widgetify Icon Metro
    The icon metro helps you add a set of icons belonging to the same category using a metro effect.

  • Widgetify Photo Canvas
    The photo canvas helps you add a group of pictures with equal heights all joined together like boxes.

  • Widgetify Post Combo
    The post combo helps you add a post combo in a box-like format that contains equal height on both sides.

  • Widgetify Post Group
    The post group helps you add a group of posts belonging to a category to your web page.

  • Widgetify Post Metro
    The post metro helps you add a metro effect to a post group. Just simply add widget and specify category and you're good.

  • Widgetify Slider
    The slider helps you add a full screen slider to the top part of your page. It is very handy and efficient for a slider.

  • Widgetify Social Media
    The social media widget helps you add a social media sticker (facebook, twitter, instagram...) to your web page.

CSS Classes

By default, Widgetify uses a number of CSS classes for styling. You can also add your own custom classes by way of hooks. Listed below are the standard Widgetify classes (to see more on specific use case, refer to documentation):

  • widgetify-hero
    This is used for styling gigantic texts shown in your slider and metro group (blog & icon) widgets.

  • widgetify-caption
    This is used for styling captions on your widgets.

  • widgetify-summary
    This is used for styling summaries that come immediately after the caption on your widgets.

  • widgetify-sub-caption
    This is used for styling sub-captions on post titles in your widgets.

  • widgetify-text
    This is used for styling normal texts on your widgets.

  • widgetify-anchor
    This is used for styling anchors found in your widgets.

  • widgetify-button
    This is used for styling buttons found in your widgets.

  • widgetify-control
    This is used for styling your widgetify form controls.

  • widgetify-block-padding
    This is used to specify the level of padding within your container-fluid sections.

  • widgetify-section
    This is used for styling widgetify sections.

  • widgetify-section-*
    This is used for styling section paddings.

  • widgetify-margin-*
    This is used for styling margin distances.

  • widgetify-overlay
    This is used for styling the overlays over backgrounds.

  • widgetify-banner
    This is used for styling your widgetify banner section.

  • widgetify-blog-group
    This is used for styling your widgetify blog group section.

  • widgetify-contact-form
    This is used for styling your widgetify contact form section.

  • widgetify-content-box
    This is used for styling your widgetify content box section.

  • widgetify-gallery
    This is used for styling your widgetify gallery section.

  • widgetify-google-map
    This is used for styling your widgetify google map section.

  • widgetify-html-container
    This is used for styling your widgetify html container section.

  • widgetify-icon-group
    This is used for styling your widgetify icon group section.

  • widgetify-icon-metro
    This is used for styling your widgetify icon metro section.

  • widgetify-photo-canvas
    This is used for styling your widgetify photo canvas section.

  • widgetify-post-combo
    This is used for styling your widgetify post combo section.

  • widgetify-post-group
    This is used for styling your widgetify post group section.

  • widgetify-post-metro
    This is used for styling your widgetify post metro section.

  • widgetify-slider
    This is used for styling your widgetify slider section.

  • widgetify-social-media
    This is used for styling your widgetify social media section.

Hooks/Extensions

You can extend the functionality of your widgetify widgets by adding the following hooks to your functions.php file or plugins. To see more on specific use case, refer to documentation. For e.g.

  • widgetify_banner_caption
    You can add a custom display to your banner caption by doing so:
add_action('widgetify_banner_caption', 'your_custom_function');
function your_custom_function($title) {
  //your code...
}

Tooling

Widgetify utilizes Bootstrap 3.3.7 and Row Spacer for UI frameworking.

  • BootStrap 3.3.7
  • Row Spacer

Requirements

WordPress

Contributions

Anyone and everyone is welcome to contribute.

Install

npm i wp-widgetify

DownloadsWeekly Downloads

0

Version

1.0.0

License

MIT

Unpacked Size

247 kB

Total Files

36

Last publish

Collaborators

  • avatar