=== Gutenberg Blocks – Qubely ===
Contributors: themeum, kawshar, jakirhasan, anik4e, faisalahmed29, delowardev, rejuancse, fahimmurshed, badsha_eee, joomcoder, sksaaju, mehedih, mhshohel
Donate link: https://www.themeum.com
Tags: Blocks, Gutenberg editor, Block editor, Block, Gutenberg, Gutenberg Blocks
Requires at least: 5.0
Tested up to: 5.2
Stable tag: 1.2.0
Requires PHP: 5.4.0
License: GPL-2.0+
License URI: http://www.gnu.org/licenses/gpl-2.0.txt

Gutenberg Blocks and readymade sections with rich customization options. Enhance Gutenberg editor with easy UI and functional blocks.

== Description ==

Qubely is a full-fledged Gutenberg block toolkit with plenty of predefined sections and modern layout packs to create beautiful pages and posts on the Gutenberg editor. It offers a whole new experience that minimizes all limitations of the Gutenberg editor and opens unlimited possibilities to create any simple to complex content on a WordPress website using the Gutenberg block editor. This user-friendly Gutenberg blocks has been developed with all necessary customization features to achieve any possible layout with Qubely Gutenberg block editor.

Qubely extends Gutenberg editor with many custom Gutenberg blocks that are missing in the Gutenberg editor. Take full control of the WordPress Gutenberg block editor with the ability to apply out of the box styling options. Create web pages and posts using Qubely’s custom Gutenberg blocks that are stunning as well as mobile optimized.

[youtube https://www.youtube.com/watch?v=_aRAQkHZiUQ]

= QUBELY GUTENBERG BLOCKS CORE FEATURES AT A GLANCE =

* Predefined sections
* Modern layout packs
* Highly customizable row columns
* Row video background & blend mode
* Drag column resizing
* Shape divider/builder
* Device specific responsive controls
* Unlimited Google web fonts & system fonts
* Classic & gradient color and background
* Built-in animation
* Box-shadow
* Font Awesome 5 Icons and line icons
* Custom CSS

> Want to know all the latest news and be part of the Qubely community? Join our Facebook Qubely Community group! [https://www.facebook.com/groups/qubely/](https://www.facebook.com/groups/qubely/)


= ADVANCED GUTENBERG BLOCKS INSIDE QUBELY =

Qubely adds numerous custom Gutenberg blocks to the Gutenberg block editor and takes Gutenberg editor to the next level. The available custom advanced Gutenberg blocks inside Qubely are:

* [Row](https://qubely.io/block/row-advanced-text/)
* [Button](https://qubely.io/block/button/)
* [Testimonial](https://qubely.io/block/testimonial/)
* [Heading](https://qubely.io/block/heading/)
* [Counter](https://qubely.io/block/counters/)
* [Tabs](https://qubely.io/block/tabs/)
* [Accordion/Toggle](https://qubely.io/block/accordion/)
* [Advanced Text](https://qubely.io/block/row-advanced-text/)
* [Video Popup](https://qubely.io/block/video-popup/)
* [Google Map](https://qubely.io/block/google-map/)
* [Progress Bar](https://qubely.io/block/progress-bar/)
* Icon
* Divider
* [Social Icons](https://qubely.io/block/social-icons/)
* [Button Group](https://qubely.io/block/button-group/)
* [Button](https://qubely.io/block/button/)
* [Info Box](https://qubely.io/block/info-box/)
* [Advanced List](https://qubely.io/block/advanced-list/)
* [Contact Form](https://qubely.io/block/contact/)
* [Icon List](https://qubely.io/block/icon-list/)
* [Pricing](https://qubely.io/block/pricing/)
* Block Wrapper
* [Team](https://qubely.io/block/team/)
* [Image](https://qubely.io/block/image/)
* [Timeline](https://qubely.io/block/timeline/)
* [Post Grid](https://qubely.io/block/post-grid/)
* More advanced Gutenberg blocks coming


 = QUBELY GUTENBERG BLOCKS FEATURES AND FUNCTIONALITIES IN DETAILS =

- **Row:** Create an amazingly functional row from a variety of column variations in this Gutenberg block editor. Resize columns using mouse drag to achieve the desired layout with this Gutenberg block. Control spacing, add video, image, color, gradient or blend to the row background. Adjust the height and place the content at the top, center or the bottom position. Add additional custom CSS code uding the Gutenberg block editor.

- **Button:** Button Gutenberg block has been designed to meet all the necessary requirements. There’s an option to design any possible combination of layout, shape or interface. You can design a flat, gradient or a line button with this Gutenberg block editor. Set button icon with the possibility to change icon position and size along with its spacing. Options are available to change the border, typography (font, size, line height, letter spacing) and shadow with the button Gutenberg block.

- **Testimonial:** Showcase the kind words of your customer on a post or a page with Qubely’s Testimonial Gutenberg block. Choose a layout from given the ones in our Gutenberg Block editor. Decide whether to show Quote Icon, Message, Name, Designation, Avatar, Ratings, etcetera and set them up in their respective settings unlike no other Gutenberg blocks.

- **Icon:** Use icons as Gutenberg blocks and place them anywhere on the pages and posts. Choose icons from our rich collection of Font Awesome and Qubely Line Icons to improve your Gutenberg Block editor experience. Display an icon with or without background and border. Apply a world of style options using Qubely Gutenberg blocks including icon size, alignment, link, background color, shadow and way more to look better.

- **Google Map:** Embed Google Maps Gutenberg blocks to your site and share your location to engage the visitors more effectively. The Google Map in Qubely advanced Gutenberg block plugin has the controls to add map address, customize map height, and zoom the map on a scale of 1 to 20.

- **Divider:** Separate your Gutenberg blocks with the stunning 28 pre-designed dividers of Qubely’s Divider Gutenberg block. Specify the divider’s height & width regardless of the device type and align them flexibly (Left/Center/Right). Color the dividers and apply animation effect the way you seem fit for your Gutenberg blocks.

- **Advanced Text:** No more restriction when it comes to styling your text content for your Gutenberg blocks. With the Advanced Text Gutenberg block of Qubely, you can apply advanced styling options. Change the typography (font, size, line height, letter spacing), tweak the design and add border & box-shadow.

- **Counter:** Have an animated number/counter on your post or page with the Counter Gutenberg block to show your milestones in an attractive manner using the Gutenberg block editor. Setup the Gutenberg block with a counter limit, determine its duration, add prefix & postfix, change the typography, and apply creative design to the content.

- **Tabs:** Display texts in beautiful predesigned tabs with three tabs design variations using Qubely Gutenberg Block editor. Add animations, icons, background colours with the highly customizable Qubely Tabs Gutenberg block. Design tabs with preferred width and spacing when creating responsive tabs to showcase features and trends to enrich your Gutenberg Block editor experience.

- **Accordion:**  Place collapsible text contents on your site and present them in a neat way with the Accordion Gutenberg block. Setup items to reveal the hidden content in an aesthetic manner. Take control over title design, border, and the typography in the Gutenberg block editor. Select item behavior & navigation icon from the dropdown and with the content wrapper option to style the inner content the way you want to using Qubely Gutenberg block editor.

- **Video Popup:** Create a nice touch to your web page using the video popup Gutenberg block without taking up much space. You can add a popup icon with the ability to change its design completely using the Gutenberg block editor. Change the typography, design the background with wrapper background, apply the overlay, box shadow and animation to bring a nice touch to your Gutenberg blocks.

- **Heading:**  Create stunning headlines/titles with the advanced Heading Gutenberg block. The more attractive a heading looks the more attention you get. Style heading text by tweaking the typography, and color using this Gutenberg block editor. Set the perfect alignment while adding the perfect animation.

- **Progress Bar:** Present your remarkable skills, experiences, or the progress of an ongoing project using the Progress Bar Gutenberg block of Qubely Gutenberg block editor. Change every single element of the Gutenberg block including the typography, color, background, and shape. Apply animation effect to your Gutenberg blocks to make it even more attractive.

- **Social Icons:** Add all your social media profiles in one place with Qubely Social Icons Gutenberg block. It includes all the popular social platforms that you can choose to display with a label, icon or both. Use styling options of Qubely Gutenberg block editor to resize the icons and add animation to make your social icons stand out.

- **Button Group:** Include trendy button groups with flexible design options with Qubely Button Group Gutenberg Block. The button group comes with predefined layouts, size options, selection of button corners and endless other customizable aspects of the Gutenberg block editor. You can create a gradient background colour effect in your button groups and enable icons from the huge icon collection. Modify hover, shadow and add animation to your buttons to have beautiful buttons throughout your site with the Gutenberg block editor options.

- **Info Box:** Place engaging information with Qubely Info Box Gutenberg block that’s bound to get user attention. Choose from the 3 predefined layouts and then further personalize it with the Gutenberg block editor settings. Enable buttons, add various media, modify background colour and shadow in your info box. The user friendly info box Gutenberg block comes with title, pre-title, animation, separators and a bunch of custom options for innovative infoboxes in your site.

- **Advanced List:**  Qubely Advanced List Gutenberg block allows you to create lists that are stylish yet informative. It comes with two predefined layouts- Classic and Fill. Choose your layout design and customize it according to your needs using the Gutenberg block editor. Select how many columns you want in the list. There is a huge selection of typography options such as choosing the font size and type, letter spacing, line height, alignment and more in Qubely Gutenberg block editor. Add icons with Advanced List Gutenberg block in your preferred size as bullet points from the huge icon library. Flexible design is possible using the Gutenberg block editor with spacing, background size, shadow and even add animation to your lists!

- **Contact Form:** Display contact forms effectively in your site with Qubely Contact Form List Gutenberg block. This Gutenberg block comes with two layouts- Classic and Material. Enable/Disable placeholders and labels in your contact form lists using the Gutenberg block editor. You even get to design your label typography with desired font size, height, spacing, area and more. Improve your input styles with preferred size, textarea height, spacing, gutter, colour, background colour and more! Enter your receiver email right from the block settings and enable captcha if you wish to do so. Finally add buttons and even animation to your creative contact form lists!

- **Icon List:** Qubely Icon List comes with the Classic and Fill predefined layouts that you can customize to make outstanding lists using the verstaile Qubely Gutenberg editor options. Choose from hundreds of icons to find the perfect ones for the icon lists on your site. Define icon list alignment and personalize the icon size, position, spacing and colour. Modify design flexibly with colour, spacing and border options using our Gutenberg block editor. The typography settings comes with options to change font size, spacing, height and more!

- **Pricing:** Craft each plan of the pricing table individually by choosing a design from 5 predefined layouts with Qubely Gutenberg Block editor. Decide whether to show features, badges, and post button text in the plan. Set up the plan’s duration, typography, style badges, and edit any text in real time. You can literally tweak each and every part of your pricing plans with Qubely Pricing Gutenberg block.

- **Block Wrapper:** Block Wrapper wraps up the block with background of your favorite color. You can set up a gradient background by defining Gradient Angle and Type in Qubely Gutenberg block editor. Apply border from the predefined styles, give box-shadow, define border radius, have hover effects and animate the entire wrapped item with preset effects.

- **Team:** Qubely’s Team block lets you enlist your team members one by one with their details like names, designations, social links, images, and more. You can choose the team member’s profile design from 3 preset layouts. Decide whether to show designation and description with the member profile. Also, apply animation effects on each of the profiles individually.

- **Image:** Insert and beautify images with Qubely Image Block. There are 2 different premade layouts (Simple and Blurb) with plenty of customization options. You can define image opacity, alignment, border-radius, and box-shadow. Animate images, set up typography, enable overlay, and many more.

- **Timeline:** Display the timelines of various events like product releases, company history & milestones, upcoming updates, achievements, and many more with Qubely’s Timeline block. Showcase detailed timelines/roadmaps and style them with plenty of customization options. Add images, texts, headings, setup connectors with icons, and tweak timeline bar your way.

- **Post Grid:** The Post Grid block lets you take the blog posts of the website and display them in different grid and list layouts. It takes care of every detail of the grid/list layout. You can define the number of blog post, style the feature image, tweak typography, control spacing, determine post excerpts, apply animation effect, and do many more with Qubely’s Post Grid block.

 = SOME EXCITING QUBELY FEATURES IN DETAILS =

Let’s dig deep into the exciting features of this advanced Gutenberg block plugin.

= PREDEFINED SECTIONS =

To help you build websites fast, Qubely has a rich library of predefined sections those can be imported and used as blocks on the , utenberg editor. You no longer need to style them from scratch. Also, you can modify their look if you ever want to. The predefined sections inside Qubely come in different categories so that you can navigate through them easily and find the one you need.

= ROW-COLUMN STRUCTURE =

With the default Column block of the Gutenberg editor, you can’t take more than two columns at a time. On the other hand, the Row block of Qubely lets you take 1 to as many as 6 columns in a single row at a time. There are multiple combinations of columns of different numbers and sizes. You just have to pick what you need. Most importantly, you can adjust the column size by flexibly dragging the columns.
Build a complex web page layout with row-column structure right on the Gutenberg editor. The widely used row-column layout building concept of major page builders is with Gutenberg editor now with the blessing of Qubely.


= ADVANCED ROW-COLUMN SETTINGS =

Alongside applying padding and margin to columns you can also set column background and hover background with single color, image, and gradient. Give column border, apply border-radius, and animate each column individually. Also, go beyond these column styling options by adding custom CSS to columns.

= VISUAL INLINE STYLING =

The rich and functional blocks inside this Gutenberg page builder offers visual inline editing and styling options. You can edit, modify, and style most of the blocks’ content staying on the blocks. Like all other Gutenberg blocks, the options to edit and modify block content are on left top of each block. So, you don’t have to go away from the block to create, edit, and modify block contents.

= DEVICE SPECIFIC RESPONSIVE CONTROLS =

Everything you create on Gutenberg editor with the help of Qubely’s custom Gutenberg blocks becomes responsive and fits well on devices of all sizes. Additionally, you can control the entire responsiveness by defining the breakpoint for small screens. If required, you can also hide blocks on different devices.

= CUSTOM TYPOGRAPHY CONTROLS =

This Gutenberg page builder gives you full control over the typography of the blocks. You can choose the font, apply font weight, font transform, set font size, line height, letter spacing in px, em, and percentage on the basis of the devices they will be displayed on.

> You may find the documentation here
> [Documentation](https://www.themeum.com/docs/qubely-introduction/)


<strong>Want To Contribute To The Plugin?</strong>

You may now contribute to the plugin on Github: <a href="https://github.com/themeum/qubely" target="_blank" rel="">Qubely Blocks on Github</a>


== Installation ==

= Minimum Requirements =

* PHP version 5.6.0 or greater (PHP 7.1 or greater is recommended)
* MySQL version 5.0 or greater (MySQL 5.6 or greater is recommended)

= Automatic installation =

The automatic installation is the easiest way to install any plugin in WordPress. You can perform an automatic installation of Qubely by logging in to your WordPress dashboard, navigating to the “Plugins” menu and click on the “Add New” button.

This will open up a page showing all the available plugins in WordPress. In the search field, type Qubely. The search result will show you our Qubely plugin, you can then see the detailed info by clicking on “More Details” and to install just click on the “Install Now” button.

= Manual installation =

To install Qubely manually, you need to download the plugin and upload it to your webserver via any FTP application.

The WordPress codex contains [instructions on how to do this here](https://codex.wordpress.org/Managing_Plugins#Manual_Plugin_Installation).


== Frequently Asked Questions ==

=  Is Qubely free? =

Yes, Qubely is a free WordPress Gutenberg block plugin. There can be a premium version as well. But there will always be a free version.

= Can I use Qubely with any WordPress theme? =

Yes, you can use Qubely with any Gutenberg compatible WordPress theme.

= Do I need Gutenberg to use Qubely? =

Yes, Qubely is built based on the Gutenberg editor. You must need Gutenberg to make this plugin work.

= Where can I get support? =

You can get support by posting on the support section of this plugin on the WordPress plugin directory, or on the Themeum support forums: https://www.themeum.com/support/ 🙂

= Where can I report a bug? =

Found a bug? Please let us know by posting on the support section of this plugin on the WordPress plugin directory or directly on our support forum. https://www.themeum.com/support/

== Screenshots ==

1. Qubely Block List
2. Qubely Blocks
3. Qubely Layout
4. Qubely Shape
5. Qubely Row
6. Qubely Column
7. Advanced Type


== Changelog ==


= 1.2.0 - 30 October, 2019 =
New: Mouse Movement effect 
Update: Contact Form block - Script  
Update: Post Grid block - Style  


= 1.1.6 - 09 October, 2019 =
Fix: Contact Form block - CSS issue in input fields  
Fix: Image block - CSS issue  
Fix: Video Popup block - fixed layout naming issue  

= 1.1.5 - 01 October, 2019 =
Fix: CSS issue in import layout modal  
Fix: Image block - Removed empty space  
Update: Carousel field - Bug fixed & finalized 


= 1.1.4 - 24 September, 2019 =
New: Image block - Image URL option  
Update: Timeline block - Item removing option  
Fix: Row block - Column reverse issue for child rows  
Fix: Row block - Column issue in responsive devices  

= 1.1.3 - 19 September, 2019 =

New: 2 page templates - Qubely Full Width, Qubely Canvas  
Update: Performance improvement  
Update: Refactored components & fields  
Fix: Post Grid block - Category clickable issue in Edit view  

= 1.1.2 - 06 September, 2019 =

Fix: Font weight issue in frontend  
Fix: Conflict with Gutenberg plugin  

= 1.1.1 - 03 September, 2019 =

Fix: Post Grid block - Front end issue  

= 1.1.0 - 02 September, 2019 =

New: Post Grid block  
New: Custom dropdown field with search option  

= 1.0.9 - 23 August, 2019 =

Update: Timeline block - Item limit increased to 100 from 20  
Fix: Inline CSS issue on frontend  

= 1.0.8 - 09 August, 2019 =

New: Timeline block  
New: Info Box block - Retina image uploading option  
New: Team block - Retina image uploading option  
New: Testimonial block - Retina image uploading option  
Fix: Image block - Top and bottom spacer issue  
Fix: CSS duplication issue on frontend  
 
= 1.0.7 - 06 August, 2019 =

New: Image Block  
Update: Testimonial Block - Ratings settings UI improved  
Fix: Qubely Options page issue  

= 1.0.6 - 01 August, 2019 =

New: Block Wrapper - Image background option  
Update: Infobox Block - Settings UI improved  
Update: Media field improvement  
Fix: Row Block - Column reverse setting  

= 1.0.5 - 24 July, 2019 =

Update: Advanced Text Block - HTML support for RichText  
Update: Testimonial Block - HTML support for RichText  
Update: Infobox Block - HTML support for RichText and image alt text  
Update: Pricing Block - HTML support for RichText  
Fix: CSS issue while exporting/importing pages  
Fix: Button Block - Outline layout hover fill color  

= 1.0.4 - 15 July, 2019 =

Update: InfoBox Block - Button enable/disable toggle position  
Update: Button Component - Panel settings improvement  
Fix: Row - Margin field issue fixed  

= 1.0.3 - 11 July, 2019 =

New: Block style copy/paste option on the context menu  
New: Typography field - gets Font family & font-weight reset option  
Fix: Button block/Button component - has default text-color & background-color for layouts  
Fix: Accordion block - not saving separator value issue  
Fix: Import layout modal conflict with Yoast SEO plugin  

= 1.0.2 - 08 July, 2019 =

New: Button Group block - Responsive setting in Alignment field  
Update: Info Box block - Button default tag  
Update: Import layout modal modification  
Fix: Tabs block - inactive tab content display issue in Backend  

= 1.0.1 - 01 July, 2019 =

New: Column block - Add column option in BlockControls  
Update: Social Icons block - Used Gutenberg’s Popover component  
Update: Icon List block - Used Gutenberg’s Popover component  
Fix: Styling issue while previewing post  
Fix: Column block - CSS selector to fix styles in child row’s columns  
Fix: Icon List block - Issue with item removal using Backspace  
Fix: Pricing block - Issue with removing any newly added feature  
Fix: Social Icons block - Icon label inline changing issue  

= 1.0.0 - 20 June, 2019 =

New: Premade sections & layouts  
New: Info Box block - Content disable option  
New: Team block - Padding option for content  
New: Contact Form block - Button alignment option  
New: Pricing & Features blocks - Custom alignment option  
New: Advanced List block - Background size option for number  
New: Button Group block - Alignment field  
Update: Redesigned import layout modal UI  
Update: Dimension field in Row & Column blocks  
Update: Testimonial block - Replaced dashicons with Font Awesome  
Fix: Accordion block - Heading update issue  
Fix: Advanced List block - Bullet icon changing issue  
Fix: Advanced List block - Line height issue  
Fix: Advanced Text & Title blocks - Separator stroke value update issue  
Fix: Advanced settings - Z-index value update issue  
Fix: Block manager - Resized qubely icons  
Fix: Button block - Button URL open in new window setting issue  
Fix: Button Group block - Spacing option issue  
Fix: Heading block - Sub heading tag change issue  
Fix: Row block - Overlay issue in inner rows  
Fix: Testimonial block -  Layout change issue  
Fix: Tabs block - Nav responsive margin issue  
Fix: Video Popup block - Icon ripple effect issue  

= 1.0.0-RC-2 - 31 May, 2019 =

New: Font family search option in typography
Update: Pricing Badge UI
Update: Tab icon setting 
Update: Gradient angle & position UI
Update: Shape divider settings in Row

= 1.0.0-RC-1 - 24 May, 2019 =

Update: Block Wraper's description & keyword
Update: Code optimization
Fix: List item auto focus issue in Advanced list & Icon list block
Fix: Border Hover color option in Icon block
Fix: Import layout Reloading Issue

= 1.0.0-beta-3 - 22 May, 2019 =

New: Global color palate setting
New: Recent font-family setting in typography
Update: Inline text-color and background-color option
Update: Removed hover option from Pricing block’s background
Fix: Text color issue in Advanced block
Fix: Border Hover color option in Icon block
Fix: Animation delay issue in global option

= 1.0.0-beta-2 - 16 May, 2019 =
Update: Gradient field color picker position
Update: Redesigned Testimonial Block's layout
Update: Responsive device setting
Update: Changed icon updating option in Pricing Block's features
Fix: Button Size issue in Pricing Block
Fix: Transition issue in Video Popup block,  Button Block


= 1.0.0-beta - 10 May, 2019 =
New: Pricing Block
New: Wrapper Block
New: Team Block
New: Redesigned user interface
New: Radically Redesigned user experience
New: Added Responsive settings to the Shape Divider
Update: Improved padding, margin, Radius, Box Shadow, Background, Color and border options
Update: Improved typography settings
Update: Restructured Advanced List block
Fix: Icon size in the icon list
Fix: Autofocus in the icon list
Fix: Video Popup SVG

= 1.0.0-alpha-4 - 28 March, 2019 =

New: Contact Form Block
New: Icon List Block
New: Advanced List Block
New: Button Group Block
New: Info Box Block
Update: Row settings 
Update: Column settings
Fix: Link open in new tab issue
Fix: Button Alignment issue
Fix: Video Popup youtube short link issue

= 1.0.0-alpha-3 - 11 March, 2019 =

Update: Tab Improvement
Fix: Social icon blocks dropdown issue

= 1.0.0-alpha-2 - 08 March, 2019 =

New: Tabs block
New: Social Icons block
Update: Row setting
Update: Column setting
Fix: Select field issue
Fix: Responsive device issue
Fix: Map block address issue

= 1.0.0-alpha - 01 March, 2019 =

* Initial Alpha Release :)


== Upgrade Notice ==

Nothing here