How to Improve Page Style after using Short code.

  • Resolved fillnfull

    (@fillnfull)


    1 month ago

    Hi,

    I have used [mycred_history user_id=”current” number=20] shortcode my page appearance is not good.

    In Short Code Documentation you have given below CSS styling, How to implement in my website from my side Please guide in steps by step.

    CSS Styling// The wrapper .mycred-history-wrapper { } // The table table.mycred-table { } // Table columns table.mycred-table .column-time { } table.mycred-table .column-username { } table.mycred-table .column-creds { } table.mycred-table .column-entry { } // Navigation .mycred-history-wrapper nav { } .mycred-history-wrapper nav ul { } .mycred-history-wrapper nav ul li { }

    Thanks and Regards in Advance.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Support bukhari10

    (@bukhari10)

    Hello @fillnfull,

    Thanks for contacting us,

    I hope you are doing well. We have forwarded your query to the appropriate team and will notify you as soon as they respond.

    Thanks & Regards
    WP Experts Support Team

    Plugin Support bukhari10

    (@bukhari10)

    Hello @fillnfull,

    Can you share the URL of the page where you have inserted mycred_history shortcode so that we can improve the styling for you.

    Thank you.

    Thread Starter fillnfull

    (@fillnfull)

    Hi,

    Here is the url

    https://fillnfull.com/my-points/

    Plugin Support bukhari10

    (@bukhari10)

    Hello @fillnfull,

    Please go to Appearance -> Customize -> Additional CSS and then paste this code.

    .mycred-history-wrapper {
        background: #f9f9f9;
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        max-width: 800px;
        margin: 20px auto;
    }

    /* Title */
    .history-title {
        text-align: center;
        font-size: 22px;
        color: #333;
        font-weight: bold;
        margin-bottom: 15px;
    }

    /* Table Styling */
    .mycred-table {
        width: 100%;
        border-collapse: collapse;
        background: #fff;
        border-radius: 8px;
        overflow: hidden;
    }

    /* Table Header */
    .mycred-table thead {
        background: #007bff;
        color: #fff;
    }

    .mycred-table th {
        padding: 12px;
        text-align: left;
        font-size: 16px;
    }

    /* Table Rows */
    .mycred-table td {
        padding: 12px;
        border-bottom: 1px solid #ddd;
        text-align: left;
    }

    /* Alternating Row Colors */
    .mycred-table tr:nth-child(even) {
        background: #f2f2f2;
    }

    /* Points Styling */
    .positive {
        color: #28a745;
        font-weight: bold;
    }

    .negative {
        color: #dc3545;
        font-weight: bold;
    }

    /* Responsive Design */
    @media (max-width: 600px) {
        .mycred-table th, .mycred-table td {
            font-size: 14px;
            padding: 8px;
        }
    }

    Feel free to reach out if you have any further questions or need assistance.

    Thank you.

    Thread Starter fillnfull

    (@fillnfull)

    Hi,

    Now its looking good than you.

    Plugin Support bukhari10

    (@bukhari10)

    Hi @fillnfull,

    We would greatly appreciate your kind and honest review. Your feedback is essential and can help other users make informed decisions about our products and services.

    Thank you for taking the time to share your thoughts.

    • This reply was modified 3 weeks, 3 days ago by bukhari10.
Viewing 6 replies - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.