Installing and configure WordPress plugin Zupper CODE

Install Zupper CODE plugin

Zupper CODE is compatible with Visual Composer

Add blog posts

Add blog shortcodes

Classic editor mode

Use this code in your WP text editor: [zuppercode_posts]

Shortcode arguments and default values

  • 'title' = 'Blog posts'
  • 'subtitle' = ''
  • 'talign' = 'left'
  • 'count' = '1'
  • 'columns' = '1'
  • 'offset' = '0'
  • 'zupcat' = ''
  • 'show_categories' = 'yes'
  • 'show_comments' = 'yes'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add services posts

Add services shortcodes

Classic editor mode

Use this code in your WP text editor: [zuppercode_services]

Shortcode arguments and default values

  • 'title' = 'Services'
  • 'subtitle' = ''
  • 'talign' = 'left'
  • 'count' = '1'
  • 'columns' = '1'
  • 'zupcat' = ''
  • 'ttop' = 'yes'
  • 'offset' = '0'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add portfolio posts

Add portfolio shortcodes

Classic editor mode

Use this code in your WP text editor: [zuppercode_portfolio]

Shortcode arguments and default values

  • 'title' = 'Zupper code portfolio'
  • 'subtitle' = ''
  • talign' = 'left'
  • 'count' = '12'
  • 'columns' = '3'
  • 'categories' = 'yes'
  • 'categories_align' = 'left'
  • 'separated' = 'yes'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add testimonials posts

Add testimonials shortcodes

Classic editor mode

Use this code in your WP text editor: [zuppercode_testimonials]

Shortcode arguments and default values

  • 'title' = 'What our clients say'
  • 'talign' = 'left'
  • 'avatar' = ''
  • 'columns' = '1'
  • 'count' = '1'
  • 'offset' = '0'
  • 'type' = 'vertical'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add partners posts

Add partners shortcodes

Classic editor mode

Use this code in your WP text editor: [zuppercode_partners]

Shortcode arguments and default values

  • 'title' = 'Partners'
  • 'subtitle' = ''
  • 'talign' = 'left'
  • 'navigation' = 'side'
  • 'count' = '18'
  • 'columns' = '6'
  • 'offset' = '0'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add banners posts

Add banners shortcodes

Classic editor mode

Use this code in your WP text editor: [zuppercode_advertising]

Shortcode arguments and default values

  • 'id' = ''
  • 'title' = ''
  • 'talign' = 'left'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add simple parallax contaier

Classic editor mode

Use this code in your WP text editor: [zuppercode_parallax_image]

Shortcode arguments and default values

  • 'alpha' = '75'
  • 'top' = '30'
  • 'bottom' = '30'
  • 'left' = '30'
  • 'right' = '30'
  • 'img' = ''

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add other shortcodes

Separator shortcode

Classic editor mode

Use this code in your WP text editor: [zuppercode_separator]

Shortcode arguments and default values

  • 'top' = '0'
  • 'bottom' = '0'
  • 'color' = '#FFFFFF'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Add bootstrap shortcodes

Bootstrap accordion container

Classic editor mode

Use this code in your WP text editor: [zuppercode_accordion_content]

Shortcode arguments and default values

  • 'title' = ''
  • 'extra_class' = ''

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Bootstrap accordion item

Classic editor mode

Use this code in your WP text editor: [zuppercode_accordion_item]

Shortcode arguments and default values

  • 'title' = ''
  • 'class' = ''
  • 'active' = 'no'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Bootstrap alerts

Classic editor mode

Use this code in your WP text editor: [zuppercode_alert]

Shortcode arguments and default values

  • 'class' = 'alert-success'
  • 'extra_class' = ''
  • 'add_close' = 'no'

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Bootstrap buttons group container

Classic editor mode

Use this code in your WP text editor: [zuppercode_button_content]

Shortcode arguments and default values

  • 'title' = ''
  • 'extra_class' = ''

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Bootstrap buttons item

Classic editor mode

Use this code in your WP text editor: [zuppercode_button]

Shortcode arguments and default values

  • 'type' = ''
  • 'class' = 'btn-default'
  • 'extra_class' = ''
  • 'size' = 'btn-lg'
  • 'text' = 'Button'
  • 'link' = '#'
  • 'target' = ''

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Bootstrap progress bar container

Classic editor mode

Use this code in your WP text editor: [zuppercode_progress_content]

Shortcode arguments and default values

  • 'title' = ''
  • 'extra_class' = ''

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Bootstrap progress bar item

Classic editor mode

Use this code in your WP text editor: [zuppercode_progress_bar]

Shortcode arguments and default values

  • 'type' = ''
  • 'class' = 'progress-bar-success'
  • 'extra_class' = ''
  • 'value' = '25'
  • 'minim' = '0'
  • 'maxim' = '100'
  • 'width' = '25'
  • 'bar_text' = ''
  • 'sr-only' = ''

Visual Composer mode

Select Zupper CODE tab from Visual Composer, select element, set your options like in the image below and click save changes.

Plugin compatibility

For best compatibility we recommend to use this item with Zupper web theme and Visual composer plugin.

In some cases, depending on your theme's CSS styles, elements may not appear 100% exactly like in demo (images, fonts and text sizes, link colors, borders, header margins, etc.). We try to update any major bug as soon as we find any conflicts.

If you already have Visual Composer plugin in your WordPress theme it is much easyer because Zupper CODE is now compatible.

Important! All shortcodes must be written between square brackets. Attributes are separated by spaces and attribute values must be written between quotes, after the attribute name and equal sign.