Caption/Heading Font Size

victoria · 2015-07-14 23:41:08

Is there a way to change the font size of the caption/headings displayed in the gallery highslide? All I see is a slider for the alignment under Large Image Presentation. There's a metadata display control under thumbnail grid, but this doesn't affect the caption/heading info.

Also, is there a way to move the cart icon from the upper right corner?

Thanks,

Victoria

rod barbee · 2015-07-15 01:06:09

Hi V,

all that will have to be done with custom css

here are a couple of blog posts that might help:
http://ttg-tips-and-tricks.barbeephoto. … selectors/

and though this isn't specific to the cart icon, the concept applies:
http://ttg-tips-and-tricks.barbeephoto. … galleries/

Keep in mind that if you move the cart icon you might cause problems with other icons you might use in the future, like the color label icons.

victoria · 2015-07-17 02:20:06

Ok, I found the inspect element and this is what it said:

media="all"
.highslide-heading p, .highslide-caption p {
font-size: 12px;
line-height: 1.5em;
margin: 0;
text-align: left;
}

I changed the font size to 18 px and text align to center and it showed me the changes which I liked.
So I went into the custom.css file and put that information in as follows:

media="all"
.highslide=heading p,
.highslide=caption p {
font-size: 18px;
text-align: center;
}

No difference, what am I missing?

http://victoriasimages.com/test/galleries/bw-florals/

is the link to the gallery. Click on the first image of the gallery, then right click on the title of the image - Butterflies- to inspect element.

I noticed the phpplugin folders all have - sample after them. So i removed the -sample to get the red background trial to work. I also noticed that there are multiple phpplugin folders. Which one do I use? I have the new website under my url in a test folder. When I did the red color background test I had to replace the custom css in the top level folder not in my test folder to get it to work. So I'm really not clear where to put this custom css.

Thanks!

V

victoria · 2015-07-17 02:22:03

I tried putting the custom css file in the very top level of my website, under the test folder and in the galleries folder. None seemed to work.

Thanks,

V

rod barbee · 2015-07-17 02:54:23

HI V,

Right now, the only custom css that page is using is coming from your main site:
http://victoriasimages.com/phplugins/css/custom.css

to get custom css to work for the test site you should put the phplugins/ folder in the test/ folder (which it looks like you have). The server path to phplugins will have to reflect that folder:
/home/mdawson/public_html/victoriasimages/test/phplugins
So make sure that path is in the server path to phplugins field all your templates for the test site

I also noticed that there are multiple phpplugin folders. Which one do I use?

You only need the one phplugins/ folder in the root of the site.
When phplugins in enabled in any of the plug-ins you'll get that phplugins-sample/ folder. You don't need to do anything with that. As long as each of your pages points to the phplugins/ folder in the root of the site ( in this case, in the /test/ folder) you'll be ok.

You've got your css in the right place for the test site ( http://victoriasimages.com/test/phplugi … custom.css ). In addition to making sure you've got the correct server path to phplugins, you'll also need to update the path to custom css inside the phplugins.php file. The pertinent line in the phplugins file should now be:

<link rel="stylesheet" href="/test/phplugins/css/custom.css" />

And this is all you should need for the large image captions in the custom.css file:

.highslide-heading p, .highslide-caption p {
  font-size: 18px;
  line-height: 1.5em;
  margin: 0;
  text-align: center;
}

no need for the media = "all"

Also, since you're set up in a test folder instead of a subdomain, you'll need to change all those paths again when you replace your CE3 site with your CE4 site.

rod barbee · 2015-07-17 03:16:02

Oh, and if you want to try moving the add-to-cart icon to the upper left, you could try this css:

ul.grid-icons-tr {    
    left: 0px;
}

and if you want to try the lower left corner:

ul.grid-icons-tr {
    top:160px;    
    left: 0px;
}

Community @ The Turning Gate

#1 2015-07-14 23:41:08

Caption/Heading Font Size

#2 2015-07-15 01:06:09

Re: Caption/Heading Font Size

#3 2015-07-17 02:20:06

Re: Caption/Heading Font Size

#4 2015-07-17 02:22:03

Re: Caption/Heading Font Size

#5 2015-07-17 02:54:23

Re: Caption/Heading Font Size

#6 2015-07-17 03:16:02

Re: Caption/Heading Font Size

Board footer