Shortcodes in WordPress are small pieces of code that allow users to add dynamic content to their posts, pages, and widgets without writing extensive code. These shortcodes are placed within square brackets and can be used to embed various features like image galleries, forms, and videos. They simplify the process of adding complex functionality to a website, making it accessible even to those with limited coding knowledge. WordPress comes with a set of default shortcodes, but users can also create custom shortcodes to suit their specific needs.
Creating custom shortcodes involves writing a shortcode function and registering it using the Shortcode API. The shortcode function processes the shortcode and returns the dynamic content. This function can be added to a theme’s functions.php
file or a dedicated custom-shortcodes.php
file in a plugin. Custom shortcodes can accept an array of attributes to customize their behavior. For example, a shortcode for an image gallery might accept attributes for the number of columns, image size, and gallery ID, allowing users to configure the gallery’s appearance and content.
Shortcodes can be self-closing or enclosing. Self-closing shortcodes are standalone and do not wrap around content, such as
. Enclosing shortcodes, on the other hand, wrap around content to apply certain formatting or functionality, like This is a caption
. Both types can have default values for their attributes, which are used if no specific values are provided. This flexibility allows developers to create versatile shortcodes that can adapt to various use cases.
Additionally, shortcodes can be utilized in different parts of a WordPress site, including posts, pages, and sidebar widgets. To use shortcodes in widgets, simply add the shortcode to a text widget, and WordPress will process it as it would in any post or page. For more advanced use cases, developers can create a shortcode plugin, encapsulating the shortcode functionality within a plugin file. This approach makes it easier to manage and update the shortcode code block without modifying the theme files directly. Overall, WordPress shortcodes provide a powerful way to enhance a site’s functionality while keeping the content creation process straightforward and efficient.
In this tutorial, we will show you how to create shortcodes for the GS Logo Slider plugin. This will allow you to add slider functionality to your posts and pages easily. We will also show you how to use the shortcodes in a WordPress template file. Let’s get started!
How to create Shortcodes for the GS Logo Slider plugin
40+ ready-to-use premade shortcodes will be available after importing dummy data. You may use it as you choose. Alternatively, you can make new shortcodes. Go to, GS Logos > Logo Shortcode is where you’ll find to create a new shortcode.
To create a new shortcode, click Create New on the top right navigation menu. A shortcode may also be created under the Shortcodes tab > Create New Shortcode.
General Settings
Based on your selection on the left side, the preview will display in the right area.
- Style & Theming – Choose a Design Style and Theme from Grid, List, Table, Filter, Live Filter, Full-Width Slider, Center Mode, Variable Width Slider, Vertical Center Slider, Vertical Ticker Up, Vertical Ticker Down, 2 Rows Slider.
- Image Size – The attachment size can be obtained from the registered sources.
- Sliding Speed – Set the speed in milliseconds. Speed defaults to 500ms. To disable autoplay, set the speed to 0.
- Autoplay – Play Pause control below the Logo slider. Default Off
- Autoplay Delay – You may change the time (in milliseconds) between slides. The default duration is 4000 ms.
- Pause on Hover – When the mouse hovers over the Logo, autoplay will be disabled. Default On.
- Infinite Loop – If set to ON, clicking on “Next” on the last slide will begin again from the first slide and vice versa.
- Reverse Direction – Reverse the direction of movement. Default: Off. The default slider travels from right to left. This switch allows you to slide from left to right.
- Slider Navs – Next/Previous logo slider control. When Ticker Mode is switched on, controls are disabled by default.
- Navs Position – The next/previous control for the Logo slider. The default position is the Bottom. You may also choose a Left-Right or an Outside position.
- Slider Dots – Dots for the logo slider below the widget. Default Off.
- Dynamic Dots – It’s good to turn it on if you use it for many slides. So rather than displaying many dots simultaneously, it will just keep a few of them visible. On is the default setting.
- Play Pause – Underneath the Logo slider, you’ll find the Play Pause button.
- Logo Title – Exclude or Include the Title from the Company Name. By default, this option is disabled.
- Tooltip – You can also turn off or on the Tooltip option.
Style Settings
- Logos Style – Select from Default / Grayscale / Gray to Default / Default to Gray.
- Logo Space – The distance between each logo is adjustable. Default 10, but it can be up to 50.
- Desktop Logos – Number of logos that will be displayed on the Desktop. Default 5, adjustable to 10. (Theme: Slider1, Fullwidth Slider, Center Mode, Ticker)
- Tablet Logos – Number of logos to be displayed on the Tablet. The default setting is 3, but it may be increased to 10. (Theme: Slider1, Fullwidth Slider, Center Mode, 2 Rows Slider, Ticker)
- Mobile Logos – The minimum number of logos to be displayed. Default 2, up to 10 allowed. (Theme: Slider1, Fullwidth slider, Center Mode, 2 Rows Slider, Ticker)
- Move Logos – The number of logos to move on the transition. 1 is the default, but you can go as high as 10.
- Clickable Logos – Set the target to open the Links to New Tab / New Window. The default is a new tab.
- All Filter Name – Replace “All” text with the word of your choice in the Filter Theme.
- Filter Name Align – For Filter Themes, set the Alignment of Filters to Left/Center/Right.
When a theme is selected, several Styling Options will be assigned.
Query Settings
- Logos – Set max Logos you want to show. Set -1 for all logos
- Order – DESC / ASC
- Order By – Date / Name / ID / Random / Custom Order
- Categories – Select categories to display logos from specific categories. Select from a dropdown menu of previously created categories.
- Input Shortcode Name & Save the shortcode.
- Copy the shortcode & paste where you wish to display Logos.
How may I edit, Clone / Duplicate, or Delete a Shortcode?
After importing dummy data, 40+ ready-to-use shortcodes will be added.
You may clone/duplicate any existing or new shortcodes. You’ll get notifications like “Shortcode cloned successfully” when you clone shortcodes. The duplicate of a shortcode will also have the same settings. After clicking ‘Clone,’ you’ll receive alerts like “Shortcode cloned successfully.”
The duplicate’s name is also appended with a suffix such as Shortcode name – Cloned.
Deletion of the shortcode is straightforward. Please exercise caution before using the delete button since it will remove the shortcode.
You may select and delete many shortcodes in one go.
FAQ
How to make your own shortcode?
To make your own shortcode, start by adding a code snippet to your theme’s functions.php
file or a custom custom-shortcodes.php
file in your plugin folder. Use the add_shortcode
function to define the shortcode tags and a callback function. This callback function should include a return statement to output the content for shortcodes, making simple shortcodes that can be used in post content or widgets
What is an example of a short code?
An example of a shortcode is the gallery shortcode , which displays a gallery of images with the specified IDs. This simple shortcode can be added to post content in the Classic editor or a shortcode block in the block editor, showcasing powerful tools to display dynamic content without writing complex code.
How do you create a shortcode in HTML?
To create a shortcode that outputs HTML, include the HTML within the return statement of your shortcode function. For instance, a contact form shortcode might include HTML form elements in its return statement. Add this code snippet to your theme’s functions.php
file or plugin folder. Ensure the shortcode tags are properly registered using the add_shortcode
function.
How to add shortcode in custom template?
To add a shortcode in a custom template, use the Error: Contact form not found.do_shortcode
function within your template file. Insert the shortcode tags inside this function call within the relevant block of code. This method allows you to place simple shortcodes or more complex shortcodes directly into your theme’s source code, ensuring your custom template is shortcode ready. For example, <?php echo do_shortcode('
would include a contact form in the template.
Conclusion
That’s it! You now know how to create shortcodes for the GS Logo Slider plugin. If you have any questions or need help, please don’t hesitate to contact our team of experts by contact here. Upgrade to Pro today and get access to even more features and benefits, like additional slider templates, faster loading times, and more! Thanks for reading.
Leave a Reply