Need help with CSS Customization for Photography Classic Theme

  • Unknown's avatar
    merobellapaparazzi · Member ·

    I have the Photography Classic Theme and would like to edit the “Photography” page (the one with introductory rectangular thumbnails when clicked on takes the viewer to individual galleries). Is the idea possible to convert the rectangular shape to that of a heart shape in CSS, especially for the engagement, bridal, and wedding thumbnails?

    Also, one quick question, may I start a new website stats viewer/hits widget with CSS? I didn’t realize the useful tool of the stats widget until afterwards, when I viewed my own website when logged out. I want to be honest with viewers and don’t want to count my own hits, thus wanting to start over if possible.

    Thank you so much in advance! Any help is appreciated,
    Angela

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    Hi Angela, Heart shapes can be created with CSS, but I don’t know of anyway to create one that would allow an image to show through the heart.

    It isn’t possible to clear stats or a site.

  • Unknown's avatar
    merobellapaparazzi · Member ·

    What a bummer. Is there any way to remove the shadow and any border lines on the rectangles under the PHOTOGRAPHY tab in CSS? If so, how please?

  • Unknown's avatar
    merobellapaparazzi · Member ·

    Also, I only want to remove the shadow and any border lines for certain rectangles, not all of them.

    Then there is no possible way for the heart shape idea under the photography tab which introduces all the individual galleries?

    Is there any way to convert the circle of the sharing buttons to that of a heart shape?

    Thank you again for your time & looking forward to your reply.

  • kathrynwp · Staff ·

    Is there any way to remove the shadow and any border lines on the rectangles under the PHOTOGRAPHY tab in CSS?

    Also, I only want to remove the shadow and any border lines for certain rectangles, not all of them.

    Are you referring to the border and shadows around the images on this page:

    http://angelafrusteri.com/portfolios-2/

    If so, each image is contained in a li (list item) element with a unique ID so you can target it with CSS.

    For example, the first image has this ID: g-thumb-1. To remove the shadow on it, you could add this CSS:

    #gallery #g-thumb-1 img {
     box-shadow: none;
}

    To remove the shadow on other images on this page, you would separate them with commas, like this:

    #gallery #g-thumb-1 img, #gallery #g-thumb-2 img {
     box-shadow: none;
}

    I located these elements by using Firebug for Firefox, but there are other browser inspectors that do the same thing.

    You can learn more here about how to find your theme’s CSS in order to change it.

  • kathrynwp · Staff ·

    Then there is no possible way for the heart shape idea under the photography tab which introduces all the individual galleries?

    As thesacredpath mentioned earlier, I don’t think that’s possible.

    Is there any way to convert the circle of the sharing buttons to that of a heart shape?

    While I’ve never seen anyone do that, it may be possible if you created a heart shape image that’s the right size, and placing it as a background image behind each sharing button. You’d need to do some experimenting with it if it’s something you really wanted to try.

  • Unknown's avatar
    merobellapaparazzi · Member ·

    Thank you so much! The no shadow effect worked (I use safari). I haven’t tried the hearts yet. The hearts I would have to make in photoshop? Can you please recommend a heart shape size?

  • kathrynwp · Staff ·

    Thank you so much! The no shadow effect worked (I use safari).

    Great!

    I haven’t tried the hearts yet. The hearts I would have to make in photoshop?

    Sure – you could probably use a custom shape there.

    Can you please recommend a heart shape size?

    Since the existing shapes are 16px wide and circular I’d try with a 16px x 16px heart and go from there.

    I did find a tutorial for making a heart shape with CSS – feel free to experiment with it!
    https://css-tricks.com/examples/ShapesOfCSS/

  • The topic ‘Need help with CSS Customization for Photography Classic Theme’ is closed to new replies.