Home / Archive / MemberPress: Move Membership Content Below Product Table on Registration Page
Duplicate Snippet

Embed Snippet on Your Site

MemberPress: Move Membership Content Below Product Table on Registration Page

By default, the membership content is displayed before (above) the list of the products added for purchase on the membership registration pages. This code snippet moves a part or the whole membership content after the list of the products.

Once the code snippet is added, the effects will be applied to any membership content wrapped with the specified ID.

The sample code will be applied to any content wrapped with the "membership-content" ID. Thus, this code snippet can be applied to a part of the membership content by following these steps:

Navigate to the Dashboard > MemberPress > Memberships.
Find the membership which should be modified, and click Edit.
Switch the content editor to the Text version, by clicking the matching tab in the top-right corner of the editor.
Add the tag before the part of the content that should be moved.
Add the tag at the end (after) this content.
Save changes to membership by clicking the Update button.

The same proces can be applied to the entire membership content by placing mentioned tags before and after the entire membership content.

To change the ID used, replace the existing “membership-content” ID with the required ID on this line:

document.getElementById('membership-content');

Code Preview
php
<?php
add_action( 'wp_footer', function() {
    ?>
        <script>
            // Wait for the document to load
            document.addEventListener('DOMContentLoaded', function() {
                // Select the membership content element by ID
                const MPContent = document.getElementById('membership-content');
                // Select the first product table row element by class
                const InvTable = document.getElementsByClassName('mepr-product-rows')[0];
                // Check if both elements exist on the page
                if (MPContent && InvTable) {
                    // Move the membership content after the product table
                    InvTable.after(MPContent);
                }
            });
        </script>
    <?php
} );

Comments

Add a Comment