Here is a code to identify each nsp box by using JQuery. What this does is add nspboxN to class name. N is a incremental number. See below screenshot.
Step1. Add JQuery
Find File: \templates\gk_myfolio\layouts\blocks\head.php
Find Line: 102 and 103 which is below
- Code: Select all
// include JavaScript
$this->addJS($this->URLtemplate() . '/js/gk.scripts.js');
Replace with below
- Code: Select all
// include JavaScript
$this->addJS($this->URLtemplate() . '/js/gk.scripts.js');
$this->addJS('http://code.jquery.com/jquery-latest.js');
Step2. Add our script.
Find File: \templates\gk_myfolio\layouts\blocks\footer.php
Find Line: Add it at the end of the file.
Add below script
- Code: Select all
<script>
$(document).ready(function () {
var arts = $('.gallery .nspMain .nspArt');
arts.each(function(i){
var num = i + 1;
$(this)
.addClass('nspbox' + num )
});
});
</script>
Tip: You can use any means to include your javascript in to your joomla. Such as using modules to include your script on specific pages. See joomla extensions for more info.
Add your required css into override.css file and make sure to enable css override option from template settings.
Example , changing hover image for box1.
- Code: Select all
.nspbox1 > div > .nspContainer > div {background: url("http://demo.gavick.com/joomla16/aug2011/modules/mod_news_pro_gk4/cache/k2.items.cache.f710044bf79a4b1f5d8b085e5e5d9711_Lnsp_207.jpg") no-repeat scroll -400% -400% #000000 !important; }
Optional: See following link if you want to override links so you can use custom links.
Forum Title for Search: K2 frontpage module with categories
- Code: Select all
https://www.gavick.com/forums/133/k2-frontpage-module-with-categories-14799.html
See you around...
--------------------------------
Search terms:
Myfolio add suffix, change css, override css, custom css, nsp hover image, background image.