Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #861203

    Howdy,

    I’d like to add the text “Filter by:” in front of the portfolio grid sort options (All / Blog / Article / Resource) so it reads:

    “Filter by: All / Blog / Article / Resource”

    Seems self-explanatory I know but we’ve been told that people don’t get it.

    Any help would be appreciated!

    #861274

    Hey raisonbrands,

    To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

    Best regards,
    John Torvik

    #862150

    Hey John,

    Sure thing and apologies. The dev URL and credentials are below.

    Thanks!

    #863137

    Hi,

    Thank you for the info.

    Please add the following filter in the functions.php file.

    // custom script
    add_action( 'wp_footer', 'ava_custom_script' );
    function ava_custom_script() {
    ?>
    <script type="text/javascript">
    (function($) {
      $('.sort_by_cat').prepend('<span class="filter">Filter by: </span>');
    })(jQuery);
    </script>
    <?php
    }

    Remove browser cache or hard refresh before checking the page.

    Best regards,
    Ismael

    #863520

    Thanks Ismael,

    It adds the text to the sort options, but there’s a formatting error– “Filter by:” appears like small, super-scripted text at the end of the sort options, rather than the same size text on the same line.

    What we have: All / Articles / Industry KnowledgeFilter by: [that last bit in superscripted style]

    What we’d like:
    Filter by: All / Articles / Industry Knowledge

    Is there something in the quick CSS that’s causing a need for adjustment?
    .header_color .main_menu ul:first-child > li.current_page_ancestor > a { color: #666666 !important;}

    #avia-menu .sub-menu li:hover a { color: #666666 !important; }

    .sort_by_cat a span {
    font-size:20px!important;
    }

    #avia-menu li:hover a {
    color: #666666;
    }

    .avia-no-number { opacity: 1; }

    .av-menu-button-colored span.avia-menu-text {
    background: #f36e21!important;
    color: white !important;
    }

    .header_color .main_menu ul:first-child > li.current-menu-item > a, .header_color .main_menu ul:first-child > li.current_page_item > a, { color: #666666;}

    .header_color .main_menu ul:first-child > li.current_page_item > a { color: #666666;}

    .helvetica-websave {
    font-family: Ingra, “HelveticaNeue”, “Helvetica Neue”, Arial, Verdana, sans-serif !important;
    }

    .sort_by_cat a.active_sort span {
    background: transparent;
    color: #f36e21;
    font-size: 16px;
    }

    h1, h2, h3, h4, h5, body{
    font-family: Ingra !important;
    }

    .avia-menu-text {
    font-family: Ingra !important;
    }

    h1, h2, h3 {
    text-transform: none !important;
    }

    .header-scrolled .av-main-nav > li.current-menu-item a > .avia-menu-text {
    color: #666666 !important;
    }

    .header-scrolled .av-main-nav > li:hover a > .avia-menu-text {
    color: #666666 !important;
    }
    a.aviablank.avia-testimonial-link {
    color: #666666 !important;
    }

    .main_menu ul:first-child > li > a { font-size: 16px; }

    .page-id-734 .av-masonry-entry { cursor:default; }

    • This reply was modified 7 years, 2 months ago by raisonbrands.
    #863903

    Hi,

    Please add the following css code.

    .sort_by_cat .filter {
        display: block;
        float: left;
        margin-right: 10px;
        font-size: 20px!important;
    }

    Best regards,
    Ismael

    #864173

    Looks great and works like a charm,

    Thanks Ismael!

    #864409

    Hi,

    Great! We’ll close the thread now. Thank you for using Enfold.

    Best regards,
    Ismael

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Add Text to Portfolio Grid Sort Options’ is closed to new replies.