Southern Listeners

Loading
Thanks to Greenlava for this cool gadget. Get yours here

Saturday, May 24, 2014

Changing Flipcard Default Background Color in Blogger Dynamic View

Before
After
When you do not have an image to be used as thumbnail for a given flipcard, by default, the front card would assume a greyish background color. Here's how you can change this default color.

Go to Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.
.flipcard .items .item .card .front, .flipcard .items .item .card .back{
background-color: white !important;
}
To change the color, simply replace the word 'white' in Line 2 above. You can either use simple color text such as 'red', 'green' 'blue' etc, or, you can generate your own hex color tag if you prefer to use a specific color.

25 comments:

  1. hello again
    I want to change the font color of flipcard both back and front.
    is there any cod for that?
    thanks

    ReplyDelete
    Replies
    1. This should help. For front:

      .flipcard .items .item .card .front .title{
      color: red !important;
      }

      For back:

      .flipcard .items .item .card .back .title{
      color: yellow !important;
      }

      Delete
  2. thanks
    you could right a reference book about these css codes!

    ReplyDelete
  3. hello again
    I have another problem.
    I have 34 items in header bar.
    but when the width gets narrower they combine to each other as a pages dropdown menu.
    my broblem is that some of these items are been lost.

    this image tells the whole story:
    http://dl.1002mp3.ir/images/1.jpg

    and this is my weblog:
    www.1006mp3.ir

    is there any way to fix this problem?
    thanks

    ReplyDelete
    Replies
    1. Hi Mate,

      I'm afraid that is the default behaviour. There isn't much we can do about it since the number of items is alot. I've thought about forcing the links to go to a new line but that doesn't turn out well on different monitors unfortunately..

      Delete
  4. I am very sorry if I go out of the topic

    I am very furstrated with my blog, unable to change the background text of posts after trying for more than three weeks, with hundred of sites!!!! and codes!!!!

    please can you help me??? I am seriously need help please!!!

    this is my blog

    unified-front-against-china.blogspot.com

    you see the yellow background on text in the posts

    how can I change that through CSS? or any other way??

    Thanks...waiting your help

    ReplyDelete
  5. Yeah, I forget to mention, I want to change the yellow background color to another color, for the entire posts

    Thanks

    ReplyDelete
    Replies
    1. Hello there,

      I couldn't find any text with yellow background. Have you gotten this fixed? If you still need help with this, could you post a screenshot showing where exactly is this yellow background you're referring to?

      Delete
    2. thanks

      yes I fixed it yesterday, but the code I add it,cause another changes, makes the widget too the same background...do you know how to remove the widget Cyan color background???

      Thanks

      Delete
    3. The text background in your posts originated from your post's styling, not your template. As such, the best way to get this removed is by editing your posts (one at a time) and remove the background highlight manually. This is the cleanest way.

      But if for some reason that doesn't work, you can try adding a code to your template - which of course is not recommended:

      .post-body div div span{
      background-color: transparent !important;
      }

      Delete
    4. Thanks

      but where in template I can add this??? mean the code

      as for why I add code to change color, is because I dont want to go change whole posts color every time I want to changes the colors, of both text and backgrounds..will coast too much time

      Thanks

      Delete
    5. just for explination, I need only widget background color to be removed, not the posts background colors

      thanks

      Delete
    6. Add it to your CSS box:

      Go to Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

      Delete
    7. thanks for your replay

      but where is the code?? as for your former one..I have tried, it does remove some of the widget backgrounds..and remove the post background! which I don't want

      can you post the code?

      Thanks..appreciated

      Delete
    8. Try this. But as I've told you before, this is not the way you should go for to clean your text background. It needs to be done via your post editor, not some code. Honestly, using code is the lazy way to go about this - and in the future, you will face problem again.

      .post-body div div span, .post-body div span{
      background-color: transparent !important;
      }

      Delete
    9. I am sorry to say that you seems didn't read my post

      I said I DON'T WANT to REMOVE the background post text color,

      I want to REMOVE, the WIDGET background color, especialy the footer, which every widget have black background color..and the description in the header

      Thanks..sorry if I offended you

      Delete
    10. Thank you very much

      I have added your code, and change the color(from transparent to another) and delete my old code, that change the background text color, your code is better, didn't add backgrounds on widget, that was annoying me

      Thanks very much...sorry if I disturbed you..appreciated :)

      Delete
  6. Hi Yoga,
    I was trying to revamp my blog and chose dynamic views. While searching for how to customize, I landed up on your page. I have customized a lot as per my requirement as per your tutorials. Thank you so much :-)

    Just wanted to check with you, how do I add the facebook, google plus, and subscribe via email widgets on my blog. I couldn't find a tutorial here. Could you please guide me on this. I want it like you have on this page on the right hand side. Thank you in advance.

    You can check out my blog here www.cookingepisodes.com

    Regards,
    Jayashree

    ReplyDelete
    Replies
    1. Hello Jayashree,

      I'm afraid the DV templates are not customisable, and as such third party scripts are often not compatible. To date I havent seen a fully working method to add social media icons.

      As for Subscribe via email widget, see the following:
      http://www.southernspeakers.net/2012/10/follow-by-email-gadget-can-be-readily.html

      Delete
  7. Dear Yoga,
    slightly off-topic,
    Do you have any idea how to make all gadgets appear in dynamic view? I mean, I added 10 gadgets to my blog but only the first 9 are shown... If I remove one of these nine then the missing gadget reappear...
    Thanks a lot,
    Ofer.

    ReplyDelete
    Replies
    1. You might have altered the dock's position in the past, and this could be clipping the tenth gadget away. Bring it a little up and you should be able to see your tenth gadget:

      http://www.southernspeakers.net/2012/03/adjust-gadgets-vertical-position-in.html

      Delete
    2. Well, it appears that the problem was this code:

      #gadget-dock div.gadget-item:last-child, #spk{
      display: none !important;
      }

      and I cannot recall why did I added it...

      Thanks anyway,
      Ofer.

      Delete
  8. hey how to underline and customize Post Title on "classic in dynamic view". I tried your methods.none of them worked for me.are those Theme specific?

    ReplyDelete
    Replies
    1. This should do:

      .classic .title.entry-title{
      text-decoration: underline;
      }

      Delete

Please use the 'Ask a Question' page to shoot questions that are not related to the tutorial in the post above.