Ethos Portfolio Feature Crop Off

Support
#1

Hey there, so I have fixed the single portfolio posts to show the way I want using CSS but I cannot seem to get the actual Portfolio page itself to stop cropping the featured image. It is an artist website and I need them to show masonry with no cropping. First :sunglasses:

…is there a way around this??

And second, if not (as I searched the old forum too and not finding a solution) I can create a Portfolio using Essential Grid, but IF I do that, I will have to choose the portfolio page to be a different layout, which is fine but when you click on individual portfolio items will they still have the same look that I have now using the portfolio layout??

I am thinking not having an actual page using the portfolio layout will keep it from sending the individual items differently??

Info included below.
THANK YOU!

#2

Hey there,

Regretfully, Ethos’ Portfolio design uses cropped featured image unlike the rest of the Stacks.

The quickest route for you now is to use Essential Grid. Out of the box, when you select Portfolio Item as the source, clicking on the link will direct you to the portfolio item page.

#3

I actually listed this backwards. It is not an issue to click into an individual portfolio item from the grid, but it is an issue getting back to the main portfolio page that the essential grid is on. On an individual portfolio item it has the ethos icon for the portfolio home, but of course that is not where the essential grid is. I cannot add an essential grid to a portfolio layout, as it won’t allow me to use cornerstone on an assigned portfolio layout. What am I missing??

When you login you can see the portfolio as is with Ethos in the navigation bar and then under it you can see the port-test page where I have the essential grid. Thanks!!

#4

I see. There’s no option for this in X though so this would need custom development. I have a Javascript snippet which is working in the dev tool’s console. You can place it in your Global JS but please bear in mind that issues arising from the use of custom code and further enhancements are outside the scope of our support. Here it is:

document.getElementsByClassName("entry-parent")[0].setAttribute("href", "http://jeanneoliver.com/port-test/");

Since it’s Javascript, it will stop functioning if there’s JS conflicts in your site.

Here’s the function that outputs the parent portfolio link. You can modify that and insert in your functions.php instead of the JS route. But again, we do not support issues arising from customizations.

  function x_ethos_entry_top_navigation() {

    if ( x_is_portfolio_item() ) {
      $link = x_get_parent_portfolio_link();
    } elseif ( x_is_product() ) {
      $link = x_get_shop_link();
    }

    $title = esc_attr( __( 'See All Posts', '__x__' ) );

    ?>

      <div class="entry-top-navigation">
        <a href="<?php echo $link; ?>" class="entry-parent" title="<?php $title; ?>"><i class="x-icon-th" data-x-icon="&#xf00a;"></i></a>
        <?php x_entry_navigation(); ?>
      </div>

    <?php

  }

Thank you for understanding.

#5

Thank you @xian The javascript worked but I decided it was risky. I went with making all of my individual portfolio items to open in a lightbox leaving nothing linked to the actual post. That works very well for this site so it is a better way to go all around. Thank you though!

#6

You’re most welcome.