CSS - Styling Phoca Gallery
Phoca Gallery design may be changed by parameters or by CSS. This guide describes some tips how to change design of Phoca Gallery with help of CSS. You can customize your template CSS or directly Phoca Gallery CSS files:
media/com_phocagallery/css/main/phocagallery.css
media/com_phocagallery/css/custom/phocagallerycustom.css (in case you are using custom CSS for your gallery)
1. Hide number of images in category in Categories View
Numbers (count of images in category) may be hidden by CSS, just paste following code to your CSS file:
#phocagallery.pg-categories-view table tr td .small,
#phocagallery.pg-categories-view #phocagallery-categories-detail .pg-cats-name.small .small{
display:none;
}
2. Displaying detail icon over thumbnail (not below thumbnails like it is displayed as default)
Icons (for example - detail icon) may be displayed over thumbnails if they are stylized so - see example: Phoca Wallpapers page.
#phocagallery .detail {
bottom: 52px; /*Use own settings - depends on used items below the thumbnails */
margin: 0;
padding: 0;
position: absolute;
right: 18px; /*Use own settings */
}