Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #1439953

    Hallo Kriesi-Support,

    gibt es eine Möglichkeit nur die Titel-Schriftgröße ( die auf die H3 zugreift) des Portfolios-Rasters anzupassen, ohne die H3 grundsätzlich zu modifizieren?

    Die H3 ist im Erweiterten Styling mit 20px definiert und würde das gern so beibehalten. Allerdings ist die Schriftgröße in den Titeln des Portfolio-Raster dann zu groß und ich hätte diese gern auf 16 bzw. 14 px reduziert.

    Dann gibt es noch ein Ansichtsproblem: bei Klick auf einen Portfolio-Eintrag öffnet die Vorschau (Ajax-Portfolio). Allerdings springt die Seite dann nach oben, so dass die Pfeile zum Blättern nicht mehr sichtbar sind. Kann man das abstellen?

    Freu mich auf ein Feedback. Beste Grüße, Petra

    #1439979

    Hey Petra,
    For the font size in that element try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

    #av-sc-portfolio-1 h3.grid-entry-title.entry-title a {
    	font-size: 14px;
    }

    For adjusting the position of the ajax portfolio element try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

    function custom_portfolio_preview_container_script() { ?>
      <script>
    jQuery(document).ready(function($) {
        // Listen for clicks on elements with the specified class
        $('.page-id-3419 .grid-sort-container .grid-entry').click(function() {
            // Use setInterval to check every 100 milliseconds if the element has become visible
            var checkVisibility = setInterval(function() {
                // Check if the element is visible
                if ($('.page-id-3419 .portfolio_preview_container.open_container').is(':visible')) {
                    // Clear the interval once the element is visible
                    clearInterval(checkVisibility);
    
                    // Calculate the top position of the element and adjust it
                    var elementTop = $('.page-id-3419 #av_section_2').offset().top;
                    var newScrollTop = elementTop - 30; // Adjusting to scroll 20px above the element
    
                    // Scroll the page to the new position
                    $('html, body').animate({
                        scrollTop: newScrollTop
                    }, 1200); // 1200ms for a smooth animation
                }
            }, 100); // Check every 100 milliseconds
        });
    });
    </script>
      <?php
    }
    add_action( 'wp_footer', 'custom_portfolio_preview_container_script', 99 );

    note that the script specifically checks the page ID because the scroll position is calculated by the bottom of the element above the portfolio grid, so keep this in mind if you want to duplicate this for another page.

    Best regards,
    Mike

    #1440004

    Hallo Mike, danke für die Info. Das klappt und die Schrift ist kleiner. :-) Den Code für die Positionierung des Portfolios werde ich umgehend ausprobieren.
    Viele Grüße, Petra

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.