Sahil Gidwani

Forum Replies Created

Viewing 7 replies - 1 through 7 (of 7 total)

  • Hi @mikehende ,

    The issue seems to be with responsiveness, if the paragraph content of all cards are of separate lengths then the buttons are misaligned.

    The reason @threadi could not catch the problem is maybe due to his screen width, maybe you can try zooming in and @mikehende maybe you can try zooming out until all the paragraphs take up same number of rows.

    To fix this, you might need to play around with the CSS and perhaps even the HTML structure, so do you have access to it @mikehende ?

    Hi @adamjonx ,

    You can adjust the number of posts per row by modifying the CSS classes. Currently, your posts are using the class:

    <div class="col-md-6" style="position: absolute; left: 0px; top: 0px;">

    To display 3 or 4 posts per row, change the class from col-md-6 (which shows 2 per row) to col-md-4 (for 3 per row) or col-md-3 (for 4 per row). Here’s an example:

    • For 3 posts per row:
      <div class="col-md-4" style="position: absolute; left: 0px; top: 0px;">
    • For 4 posts per row:
      <div class="col-md-3" style="position: absolute; left: 0px; top: 0px;">

    This change will adjust the layout based on your requirement.

    Hey @matthewbaynham ,

    When working with images in a WordPress plugin using React and JSX, it’s best not to hard-code the folder structure. The folder structure could change, and hardcoding paths like ../wp-content/plugins/my_plugin/images/an_image.png can lead to issues if your plugin is moved or if WordPress is installed in a different directory.

    Instead, you can use PHP’s plugin_dir_url(__FILE__) to get the correct URL for your plugin directory. Here’s how you can pass the image path to your JavaScript code using wp_localize_script:

    function my_plugin_enqueue_scripts() {
    wp_enqueue_script('my-plugin-script', plugin_dir_url(__FILE__) . 'js/my-script.js', array('jquery'), null, true);
    wp_localize_script('my-plugin-script', 'myPluginData', array(
        'imagesPath' => plugin_dir_url(__FILE__) . 'images/',
    ));
}
add_action('wp_enqueue_scripts', 'my_plugin_enqueue_scripts');

    In your React component, you can then access the image path like this:

    <img src={${myPluginData.imagesPath}an_image.png} alt="picture" />

    This way, you ensure that your image paths are always correct, regardless of where your plugin is located.

    Sahil Gidwani

    (@sahilgidwani)

    Hey @ricknu2208 ,

    Could you try adding the following Custom CSS:

    z-index: 0 !important;

    For the element of “Contact Us”

    Sahil Gidwani

    (@sahilgidwani)

    Hey @hamsha ,

    Could you please share a copy or link to your CSV file, or even a sample CSV with some dummy data for reference? That way, I can take a closer look at what might be causing the issue.

    In the meantime, you might also want to go through the official WooCommerce documentation on how to create and import CSV files. It provides some useful insights on formatting and encoding, which could help resolve the issue as well.

    Sahil Gidwani

    (@sahilgidwani)

    Hey @petshwark ,

    For Output Before the Header:

    You’ve already identified the wp_body_open hook, which is perfect for injecting HTML right after the opening <body> tag. This hook is a solid choice because it is widely supported in modern themes and ensures your content is output early in the page load process.

    For Output After the Footer:

    For the footer, you’re correct that wp_footer is theme-dependent, but most well-coded themes do support it, including Twenty Twenty-Four. Unfortunately, WordPress doesn’t have a direct equivalent to wp_body_open at the very end of the document. However, you can reliably use wp_footer, which fires just before the closing </body> tag, assuming the theme properly calls wp_footer() in the footer.php file.

    A Universal Alternative:

    If you want to ensure your plugin is more universal and works regardless of theme support, you could hook into shutdown. This hook is fired at the very end of the WordPress lifecycle, after all output has been sent. While it’s not as elegant as wp_footer, it guarantees the footer content is added universally across themes.
    The shutdown hook would output your footer just before the response is sent back to the browser, though it may not always be perfectly placed right before the </body> tag, depending on how the theme handles output buffering.

    Hope this helps!

    Sahil Gidwani

    (@sahilgidwani)

    Hey,

    First, check if there’s already a page, post, or custom post type with the shop slug. WordPress adds -2 to a URL when the same slug is being used elsewhere. Head over to Pages → All Pages and look for any page named shop. Don’t forget to check the Trash section as well, since deleted pages can still hold onto the slug. If you find a shop page in the trash or live section, either rename it or delete it permanently.

    Once you’ve ensured no other page is using the shop slug, go to Settings → Permalinks and hit Save Changes without altering any settings. This will regenerate your permalinks and might fix the URL conflict.

    Hope this helps!

Viewing 7 replies - 1 through 7 (of 7 total)