Responsive Gutenberg Addons
Responsive can be installed and used as any standard free WordPress theme. You can install it in two ways.
To install the Responsive theme manually from the WordPress admin dashboard:
Download the latest Responsive theme from My Account > Downloads or the WordPress Repository
Login to your WordPress Dashboard
Go to Appearance > Plugins > Add New
Upload the downloaded plugin zip file
Install the Responsive Addons plugin
Activate it
To install the Responsive theme via FTP
Download Responsive plugin zip from WordPress repository
Unzip the Responsive plugin zip file
Open your WordPress site via FTP. We would recommend you to use FileZilla
From FTP, visit the root of the WordPress install
Now visit wp-content folder > plugins
Upload Responsive plugin unzipped file from step 2
Create a post or a page that you wish to build with the Gutenberg editor.
Post Carousel provides options to showcase custom post types with carousel layout. It provides an option to select available post types – posts, pages, media, or any CPT you have. It also offers taxonomy controls and predefined controls for every part of the post like Featured Image, Excerpt, Author, etc.
Post Author - Hide or Display the name of the author of the post.
Post Date - Hide or Display the published date of the post.
Post Content - Hide or Display the content of the post. If you choose to display the content, a slider will appear for you to select the content length of the post.
Columns - Decide the number of columns to display for grid.
Order by option allows you to order posts according to date or alphabetically dependent on the title.
Category controls allow you to choose posts according to categories or tags.
Orientation for the icon and a post timeline can be set to Center, Left, Right from Orientation. Arrow Alignment can be set vertically top, bottom, or center with respect to timeline card.
Carousel tab offer options to customize the post slider. The options are –
Pause On Hover
Autoplay
Autoplay speed
Infinite Loop
Transition Speed (ms)
Show Arrows & Dots
Arrow Size
Arrow Border Size
Arrow Border Radius
Testimonials are customer reviews that can be displayed on the site to add credibility. Testimonial block allows you to display a single testimonial block on your site.
Font-Size - Choose the font-size for your testimonial.
Cite Alignment - Choose left, center, or right as the alignment of the text.
This block provides options to showcase custom post type anywhere on the page. It provides category controls to choose categories or tags. It also offers predefined controls for every part of the post like Featured Image, Title, Excerpt, author, etc.
Under the Post and page grid settings tab, Content Type option allows choosing post types – posts or pages. Order by option allows you to order posts according to date or alphabetically dependent on the title. Category controls allow you to choose posts according to categories or tags.
Orientation for the icon and a post timeline can be set to Center, Left, Right from Orientation. Arrow Alignment can be set vertically top, bottom, or center with respect to timeline card.
Display Section Title - Hide or Display a title on top of the post grid. If you choose to display the title, an input box will appear for you to write a title.
Display Featured Image - Hide or Display featured image of post/page if there is one.
Display Title - Hide or Display the title of the post.
Display Author - Hide or Display the name of the author of the post.
Display Date - Hide or Display the published date of the post.
Display Excerpt - Hide or Display the excerpt of the post. If you choose to display the excerpt, a slider will appear for you to select the excerpt length of the post.
Display Continue Reading Link - Hide or Display a continue reading link for the post. If you choose to display the link, an input box will appear for you to customize continue reading text.
Post Grid Section Tag section - You can select the tag that you want to allot to the grid section such as div, header, section, main, aside, footer.
Section Title Heading tag - You can select the tag that you want to allot to the section title from H2 to H6.
Space can be managed for the content of the timeline card from the Padding tab.
Advanced Columns block acts as an outer wrapper and allows adding any Gutenberg block within it.
Columns - Decide the number of columns to display.
Column Gap option allows you to adjust the space between two columns.
Container Width controls allow you to choose a width for the columns. You can give a custom width of your choice to the columns from here.
Spacing tab offer options to customize the post slider. The options are –
Top Padding
Bottom Padding
Left Padding
Right Padding
Top Margin
Name Bottom Margin
Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it
Border Radius - You can give border-radius to the columns from here.
Testimonials are customer reviews that can be displayed on the site to add credibility. Testimonial block allows adding a number of testimonials in a nice slider.
Number of Testimonials - Decide the number of testimonials to display in the slider.
Columns - Decide the number of columns to display.
Cite Alignment - Choose left, center, or right as the alignment of the text.
Carousel tab offer options to customize the post slider. The options are –
Pause On Hover
Autoplay
Autoplay speed
Infinite Loop
Transition Speed (ms)
Show Arrows & Dots
Arrow Size
Arrow Border Size
Arrow Border Radius
Under the Colors tab, color options are available for Background, Testimonial, Name, Company and Arrows & Dots.
Under the Typography tab, options for font size, font-weight, and line-height are available for Testimonial, Name, and Company.
Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it
Border Radius - You can give border-radius to the background of the grid from here.
Spacing tab offer options to customize the post slider. The options are –
Gap Between Content & Dots
Column Gap
Content Padding
Testimonial Bottom Margin
Name Bottom Margin
Post Timeline block allows you to choose Custom Post Type and displays them in the timeline. It provides an option to select available post types as posts or pages
Under the Post timeline settings tab, Content Type option allows choosing post types – posts or pages. Order by option allows you to order posts according to date or alphabetically dependent on the title. Category controls allow you to choose posts according to categories or tags.
Orientation for the icon and a post timeline can be set to Center, Left, Right from Orientation. Arrow Alignment can be set vertically top, bottom, or center with respect to timeline card.
Display Section Title - Hide or Display a title on top of post timeline. If you choose to display the title, an input box will appear for you to write a title.
Display Featured Image - Hide or Display featured image of post/page if there is one.
Display Title - Hide or Display the title of the post.
Display Author - Hide or Display the name of the author of the post.
Display Date - Hide or Display the published date of the post.
Display Excerpt - Hide or Display the excerpt of the post. If you choose to display the excerpt, a slider will appear for you to select the excerpt length of the post.
Display Continue Reading Link - Hide or Display a continue reading link for the post. If you choose to display the link, an input box will appear for you to customize continue reading text.
Post Grid Section Tag section - You can select the tag that you want to allot to the grid section such as div, header, section, main, aside, footer.
Section Title Heading tag - You can select the tag that you want to allot to the section title from H2 to H6.
Space can be managed for the content of the timeline card from the Padding tab.
Content Timeline allows displaying historical events with vertical timeline items. The block contains various customization options; you can add a title, description, icon, date to the timeline items.
Number of Items - You can select the total number of items to display in a grid.
Orientation for the icon and a post grid can be set to Center, Left, Right from Orientation.
Heading tag - You can select the tag that you want to allot to the section title from H2 to H6.
Border Radius - You can give border-radius to the background of the grid from here.
Padding - Space can be managed for the content of the grid from the Padding tab.
Display Date - Hide or Display the published date of the post.
Date Format - Select a format for the date.
Date Settings - A date can be set for individual timeline card. If the option ‘Display Post Date’ is set as ON, then add a date for each timeline card individually.
Under the Typography tab, options for font size, font-weight, and line-height are available for Date, Heading and Content.
Under the Colors tab, color options are available for Date, Heading, and Content.
This block allows you to place an icon in a list format. You can select from 62 icons under Icon Settings tab.
Under the Colors tab, color options are available for Text, Icon, Icon Background, Icon Border.
This block allows you to place a number of buttons in a group format.
Under the General tab, you can select the button alignment as left, right, or center.
Under the Colors tab, color options are available for Text, Background, Border.
