Shortcodes Reference

Overview

This document provides a comprehensive reference for all shortcodes available in the RFC WooCommerce Dynamic Stock Description plugin.

Main Shortcodes

`[rfc_stock_field_dynamic]`

Primary shortcode - Creates HTML containers for dynamic switching of stock descriptions based on inventory status.

Basic Usage

[rfc_stock_field_dynamic]

Attributes

Attribute	Default Value	Description
`wrapper_class`	`rfc-dyn-stock-wrapper`	Main wrapper CSS class
`in_id`	`rfc-dyn-in-stock`	ID for "in stock" message
`bo_id`	`rfc-dyn-backorder`	ID for "backorder" message
`oo_id`	`rfc-dyn-out-of-stock`	ID for "out of stock" message
`no_wrapper`	`0`	Disable wrapper (`1` = no wrapper)
`show_only`	-	Show only selected block (`in_stock`, `backorder`, `out_of_stock`)
`hide`	-	Hide selected blocks (e.g., `in_stock,backorder`)
`allow_multiple`	`0`	Allow multiple instances (`1` = yes)
`product_id`	`0`	Product ID (0 = auto-detect)
`variation_id`	`0`	Variation ID (0 = auto-detect)
`group`	`global`	Group for organizing multiple instances

Usage Examples

Basic Usage:

[rfc_stock_field_dynamic]

Custom Classes:

[rfc_stock_field_dynamic wrapper_class="my-stock-wrapper" in_id="my-in-stock"]

Without Wrapper:

[rfc_stock_field_dynamic no_wrapper="1"]

Show Only In Stock:

[rfc_stock_field_dynamic show_only="in_stock"]

Hide Out of Stock:

[rfc_stock_field_dynamic hide="out_of_stock"]

Multiple Instances:

[rfc_stock_field_dynamic group="main" instance="1"]
[rfc_stock_field_dynamic group="cart" instance="2" allow_multiple="1"]

`[rfc_stock_field]`

Displays stock messages based on specified type.

Attributes

Attribute	Description	Example
`product_id`	Product ID	`product_id="123"`
`variation_id`	Variation ID	`variation_id="456"`
`type`	Message type	`type="in_stock"`
`process`	Process shortcodes	`process="1"`

Usage Examples

Auto-detect Stock Status:

[rfc_stock_field type="auto"]

Specific Stock Type:

[rfc_stock_field type="in_stock"]
[rfc_stock_field type="backorder"]
[rfc_stock_field type="out_of_stock"]

Specific Product:

[rfc_stock_field product_id="123" type="in_stock"]

`[rfc_in_stock]`

Displays in-stock message for current product.

Usage

[rfc_in_stock]

`[rfc_backorder]`

Displays backorder message for current product.

Usage

[rfc_backorder]

`[rfc_out_of_stock]`

Displays out-of-stock message for current product.

Usage

[rfc_out_of_stock]

`[rfc_ping]`

Test shortcode to verify plugin functionality.

Usage

[rfc_ping]

Output: rfc ok

HTML Structure

With Wrapper (Default)

<div class="rfc-dyn-stock-wrapper elementor">
    <div id="rfc-dyn-in-stock" data-rfc-group="global"></div>
    <div id="rfc-dyn-backorder" data-rfc-group="global"></div>
    <div id="rfc-dyn-out-of-stock" data-rfc-group="global"></div>
</div>

Without Wrapper

<div id="rfc-dyn-in-stock" data-rfc-group="global"></div>
<div id="rfc-dyn-backorder" data-rfc-group="global"></div>
<div id="rfc-dyn-out-of-stock" data-rfc-group="global"></div>

Simple Products - Basic Blocks

<div id="rfc-simple-in-stock-shortcode"></div>
<div id="rfc-simple-backorder-shortcode"></div>
<div id="rfc-simple-out-of-stock-shortcode"></div>
<div id="rfc-simple-product-shortcode" data-stock-quantity="X" data-backorder-allowed="yes/no"></div>

CSS Styling

Basic Styles

.rfc-dyn-stock-wrapper {
    position: relative;
}

/* Hide inactive blocks */
.rfc-dyn-stock-wrapper > div {
    display: none;
}

/* Show only active block */
.rfc-dyn-stock-wrapper > div.is-active {
    display: block;
}

Custom Styles

.my-stock-wrapper {
    background: #f0f0f0;
    padding: 10px;
    border-radius: 5px;
}

#my-in-stock {
    color: green;
    font-weight: bold;
}

Practical Applications

1. Elementor Templates

[rfc_stock_field_dynamic]

Then in product settings:

In Stock: [elementor-template id="39433"]
Backorder: [elementor-template id="39434"]
Out of Stock: [elementor-template id="39435"]

2. Custom Messages

[rfc_stock_field_dynamic wrapper_class="stock-message"]

With content:

In Stock: "✅ Available - Ships in 24h"
Backorder: "⏰ On backorder - 2-3 weeks"
Out of Stock: "❌ Unavailable"

3. Multiple Instances

<!-- Main message -->
[rfc_stock_field_dynamic group="main"]

<!-- Additional message in cart -->
[rfc_stock_field_dynamic group="cart" allow_multiple="1"]

How It Works

JavaScript automatically switches visibility of appropriate divs
AJAX fetches current stock status
CSS hides/shows appropriate containers
Elementor animations are automatically reinitialized

Advantages of HTML Divs vs Shortcodes

HTML Divs:

✅ Faster - No shortcode processing
✅ Flexible - Easy CSS styling
✅ Dynamic - Automatic switching
✅ Compatible - Works with Elementor

Traditional Shortcodes:

❌ Slower - Require processing
❌ Static - Don't change automatically
❌ Limited - Harder to style

Responsive Design

All divs are automatically responsive and compatible with:

Desktop - Full functionality
Tablet - Adjusted sizes
Mobile - Optimized display

Troubleshooting

Divs Not Switching

Check if JavaScript is loaded
Check browser console for errors
Ensure shortcode is properly placed

Styles Not Working

Check if CSS is loaded
Use !important if needed
Check CSS selector specificity

Elementor Not Working

Ensure elementor class is added
Check if animations are reinitialized
Verify Elementor CSS is loaded

💡 Tip: Use [rfc_stock_field_dynamic] instead of traditional shortcodes for better performance and flexibility!