Okay
  Public Ticket #149245
Portfolio Thumbnail as Link to Detail
Closed

Comments

  • William started the conversation
    January 18, 2014 at 4:18pm
    I want to say, I really like this theme and I hope you're enjoying the fruits of your hard work :-) So, my question: when using the "standard" portfolio with "Meta below thumb", I want to deactivate the color overlay and two buttons that appear on desktop browsers. I want the experience to mirror the simplicity of mobile where I just click on the image and go to the detail. Ideally, the Meta Title would be clickable too and take me to the detail as well. Thanks for your help!
  •  1,070
    ThemeNectar replied
    January 21, 2014 at 12:08pm

    Hey William!

    Add this into your custom css box: 

    .work-info-bg {
   display: none!important;
}

portfolio-items .col .vert-center a:nth-child(1) {
   position: absolute;
   display: block;
   width: 100%;
   height: 100%;
   text-indent: -9999px!important;
   top: 0px;
   left: 0px;
   background-color: transparent!important;
   border-radius: 0px!important;
}

.portfolio-items .col .vert-center a:nth-child(2) {
   display: none!important;
}

    Cheers :)

  • Andrew replied
    January 27, 2014 at 7:34am

    Hello Nectar! Have a huge request that is extremely similar to this case:

    1. Do you have a code or is their an option where I can simply remove the "View Larger" and "More Details" buttons from my galleries/portfolios when the "Meta below thumb w/links on hover" option is selected? This includes losing the "View Larger" button as well when the "Lightbox Only" link is checked. In the end, only the meta will be displayed below the images with the hover accent color appearing when there is a mouseover. No buttons will appear. If the "lightbox only" box is unchecked, the box will simply link to the page. If it IS checked, then it will simply bring the picture forth as a lightbox picture.

    2. At the same time, is it possible to remove the meta text and do the same thing to the "Meta on hover + entire thumb link"? So in the end, it will simply just use the hover feature with no information displayed?

    Please let me know your thoughts and if you need anymore clarity and thanks again for all your hard work!

    Thanks
    -Andrew

  •  1,070
    ThemeNectar replied
    January 30, 2014 at 3:48am

    Hey Andrew!

    1. Enter this into your custom css box:

    .portfolio-items .col .vert-center a:nth-child(1) {
   position: absolute;
   display: block;
   width: 100%;
   height: 100%;
   text-indent: -9999px!important;
   top: 0px;
   left: 0px;
   background-color: transparent!important;
   border-radius: 0px!important;
}

.portfolio-items .col .vert-center a:nth-child(2) {
   display: none!important;
}

    2. And this:

    .portfolio-items .style-2 .work-info {
  display: none!important;
}

    Cheers :)

  • Andrew replied
    January 30, 2014 at 3:49am

    Thanks so much Nectar! Will try this ASAP

  •  1,070
    ThemeNectar replied
    January 31, 2014 at 11:54am

    You're welcome & sounds good :)

  • Andrew replied
    February 18, 2014 at 5:34am

    Hey Nectar,

    Sorry for the late response on this. The code is great! Everything works like I requested except option 1. Option 1 (from my previous post) is still not functioning correctly. If "Meta below thumb w/links on hover" is selected and lightbox only is UNCHECKED it still opens the lightbox instead of treating the hover as a page link instead of a lightbox. Is there a way to fix this?

    If it helps, option 2 works just fine. If "Meta on hover + entire thumb link" is selected and lightbox only is UNCHECKED, it does act as a link only. However, option 1 is still not functioning correctly. Let me know if you think I've input something incorrectly or if there is an easy fix to this. Thanks again for your help and coding wisdom!

  •  1,070
    ThemeNectar replied
    February 19, 2014 at 1:34pm

    Hey again! :)

    Change the first css snippet to this and give it a try:

    .work-info-bg {
   display: none!important;
}

portfolio-items .col .vert-center a:nth-child(2) {
   position: absolute;
   display: block;
   width: 100%;
   height: 100%;
   text-indent: -9999px!important;
   top: 0px;
   left: 0px;
   background-color: transparent!important;
   border-radius: 0px!important;
}

.portfolio-items .col .vert-center a:nth-child(1) {
   display: none!important;
}

     

  • Darrell replied
    May 26, 2014 at 7:20pm

    Hello mate,

    I too want to achieve something like this so I just stole your above CSS snippet which works great :) Question is... is there any way to change the wording of the overlay from 'More details' to something like 'View' or 'Watch'

    Cheers,

    Darrell

  •  8,839
    Tahir replied
    May 26, 2014 at 11:52pm

    Hey Darrell!

    Yes you could change it by installing the "codestyling localization" plugin which lets you translate/ edit the theme. 

    Thanks

    ThemeNectar Support Team 

  • Darrell replied
    May 26, 2014 at 11:54pm

    Ahhh cool, good thinking ;)

    Cheers Tahir

  • Ted replied
    August 7, 2014 at 5:05am

    I, too, am using this custom CCS. However, I'd like for the entire thumb image to be a clickable hyperlink to the the portfolio item. Is this possible?

  •  8,839
    Tahir replied
    August 7, 2014 at 11:22am

    Hey Ted!

    Yes its  possible though would require changing the markup of the whole thumb in "salient/nectar/tinymce/shortcode-processing.php" . 

    thanks

    ThemeNectar Support Team