Add article title in gk-portfolio

Hello, could u give me advice where i can add in code wp article title to gk-portfolio?

Hello,

Please check this similar thread:
https://www.gavick.com/forums/creativit ... icon-27143

Thx!


This topic helped me


First i edited portfolio.js in /wp-content/themes/Creativity/js/widgets/portfolio.js

Code: Select all

 // add overlays
   widget.find('.gk-image').each(function(i, img) {
      var img = jQuery(img);
      var title = jQuery(img).attr('title');
      if(img.find('.gk-img-overlay').length == 0) {
         // create overlays
         var overlay = jQuery('<div class="gk-img-overlay"></div><div class="nowe">'+title+'</div>');
         overlay.html('<span>'+title+'</span>');
   
         img.append(overlay);
         // add overlay events
         img.mouseenter( function() {
            var overlay = img.find('.gk-img-overlay');
            var realImg = img.find('img');
            overlay.css({
               'margin-left': (-1.0 * (realImg.width() / 2.0)) + "px",
               'width': realImg.width() + "px"
            });
            overlay.attr('class', 'gk-img-overlay active');
         });

         img.mouseleave(function() {
            var overlay = img.find('.gk-img-overlay');
            overlay.attr('class', 'gk-img-overlay');
         });
      }
   });

Secondly i add css in extension.css

Code: Select all

.nowe
{
 background: none repeat scroll 0 0 rgba(6, 159, 219, 0.8);
    bottom: 0;
    color: #fff;
    font-size: 15px;
    line-height: 40px;
    position: absolute;
    width: 100%;
}


and change background in style1.css

Code: Select all

.gk-portfolio .gk-images-wrapper > a > .gk-img-overlay > span {
   background: rgba(6, 159, 219, 1);
   color:#fff;
}

Maybe it will usefull for someone

Effect:

Thank you for sharing, I'm sure it will be helpfull for other users.