How to Customize Jupiter Shortcodes

Last Updated on

One of the essential parts of Artbees themes is shortcodes. Users can enter shortcodes via the Visual Composer by adding different Elements (Shortcodes). Here is how you can customize Jupiter shortcodes.

In this article

Customize Jupiter Shortcodes

Customize Jupiter Shortcodes Visual Composer

All shortcode implementations can be located under the components > shortcodes folder of the Jupiter theme.

Customize Jupiter Shortcodes File Structure

Each shortcode has it’s own folder which consists of the main PHP file, the Config file and assets related to the shortcode, including CSS, Javascript and helper PHP files depending on the functionality of the shortcode.

Customize Jupiter Shortcodes File Structure 2

These shortcodes can be customized by copying appropriate files into the exact same file structure inside Child Theme. Here is a step-by-step guide to customize the standard shortcodes:

1
Create a Child Theme.  

Create a Child Theme out of the main theme. Click here for more detailed information on how to do that.

2
Copy Files into Child Theme.  

Create a folder structure od components > shortcodes > (Folder Name of the Shortcode), then copy over the specific shortcode PHP file that you want to customize into your child theme shortcodes folder. (Dropcap shortcode in our case)

Customize Jupiter Shortcodes Child Theme

3
Copy Files.  

Modify the newly copied file to customize it as you wish. (We change the span tag of Dropcap shortcode to em tag in this example)

Customize Jupiter Shortcodes Changing the Code

Customize Jupiter Shortcodes Changing the Code 2

4
Test Your Customized Code on the Front End of Your Website. 
x
Note: In each major update (in some cases minor updates) the content of the shortcode template files gets changed. Therefore it’s suggested to check your overridden files in each theme update by comparing the files codes with those of the parent theme.

Shortcodes and Their File Names:

  • Shortcode (Element) Name: File Name
  • Advanced Google Maps: mk_advanced_gmaps.php
  • Audio Player: mk_audio.php
  • Blockquote: mk_blockquote.php
  • Blog Carousel: mk_blog_carousel.php
  • Blog Showcase: mk_blog_showcase.php
  • Blog: mk_blog.php
  • Button: mk_button.php
  • Chart: mk_chart.php
  • Circle Image Frame: mk_circle_image.php
  • Clients: mk_clients.php
  • Contact Form: mk_contact_form.php
  • Contact Info: mk_contact_info.php
  • Content Box: mk_content_box.php
  • Custom Box: mk_custom_box.php
  • Custom List: mk_custom_list.php
  • Custom Sidebar: mk_custom_sidebar.php
  • Divider: mk_divider.php
  • Dropcaps: mk_dropcaps.php
  • Edge Slider: mk_edge_slider.php
  • Employees: mk_employees.php
  • Fancy Title: mk_fancy_title.php
  • FAQ: mk_faq.php
  • Flexslider: mk_flexslider.php
  • Font Icons: mk_font_icons.php
  • Image Gallery: mk_gallery.php
  • Highlight Text: mk_highlight.php
  • Icon Box: mk_icon_box.php
  • Image: mk_image.php
  • Layerslider: mk_layerslider.php
  • Milestones: mk_milestone.php
  • Mini Callout Box: mk_mini_callout.php
  • Moving Image: mk_moving_image.php
  • News: mk_news.php
  • Padding Divider: mk_padding_divider.php
  • Page Section: mk_page_section.php
  • Portfolio Carousel: mk_portfolio_carousel.php
  • Portfolio: mk_portfolio.php
  • Pricing Table: mk_pricing_table.php
  • Revolution Slider: mk_revslider.php
  • Progress Bar: mk_skill_meter_chart.php
  • Skill Meter: mk_skill_meter.php
  • Skype Number: mk_skype.php
  • Social Networks: mk_social_networks.php
  • Process Builder: mk_steps.php
  • Testimonials: mk_testimonials.php
  • Title Box: mk_title_box.php
  • Toggle: mk_toggle.php
  • Tooltip: mk_tooltip.php
  • Accordion: vc_accordion_tab.php
Was this helpful?
Previous Article:
Next Article:

Can't find what you're looking for?

Open New Ticket