Changing size in "Mini Content Area" « Support Forum | Kriesi.at

Support Forum » Flashlight

Changing size in "Mini Content Area"

16 posts from 6 voices

Started 1 year ago by tanzj
Latest reply from Petervdzee
This topic is not a support question

Tags:

tanzj
Member

Sorry for my question, i use mini content area with minimal skin in "Flashlight", i would like to change the width of this area and i wish to khow if is it possible to make it transparent? Thank's a lot
gigi

Posted 1 year ago #
Dude
Dude
Hey,
you can change the width + opacity with following code - I'd add it to css/custom.css:
```
.entry-mini {
opacity: 0.5;
width: 500px;
}
```
You can change the values :)
Posted 1 year ago #
perenoksson
Member

That's very neat. But it makes the text transparent as well!

Posted 1 year ago #
tanzj
Member

Thank's a lot
gigi

Posted 1 year ago #
Dude
Dude

Yes - you can use a semi transparent png if you'd like to avoid transparent text/content.

Posted 1 year ago #
myrton
Member

Hi, is there any way to provide the code to change the mini content into semi-transparent using a png as background, but keeping the text and info inside 100% visible?

Posted 1 year ago #
Dude
Dude

Have a look at this thread: http://www.kriesi.at/support/topic/add-transparent-box-as-the-background-of-sidebar

Posted 1 year ago #
myrton
Member

I have tried changing all the .entry-mini, .box etc in the css, even tried creating a new template with no luck.
My client is really asking for a transparent front page box, I could really need the help here!

Posted 1 year ago #
Dude
Dude

Please modify the css and post a link.

Posted 1 year ago #
Petervdzee
Member

Hello, I also wanted to change the background color.

In the Admin under Custom CSS I added this.

.entry-mini {
transparent url(../images/skin-minimal/bg-trans.png) repeat 0 0;
}

Could you maybe give me advice what I am doing wrong?
I use the same transparant image as in the left menu.

Best Regards,

Peter van der Zee

Posted 1 year ago #

Dude
Dude

You need to use:

.entry-mini {
background: transparent url(../images/skin-minimal/bg-trans.png) repeat 0 0;
}

instead.

Posted 1 year ago #

Petervdzee
Member

Hello Dude,

I pasted the code in the Quick CSS field. It did not work out for me however.
Do you maybe know how come? You can see the site on http://www.topsportcamera.nl.

Hope that would help.

Greets peter

Posted 1 year ago #
Chris Beard

Hey,

To make the background transparant try this instead of what Dude suggested:
.entry-mini .box{background:none !important;}
or
.entry-mini .box{transparent url(../images/skin-minimal/bg-trans.png) repeat 0 0;}

Posted 1 year ago #
Petervdzee
Member

Hi guys,

I am sorry, it does not seem to work, I also try variations like this one:

.entry-mini .box {
background: transparent url(../images/skin-minimal/bg-trans.png) repeat 0 0 !important;
}

Maybe I can give someone access to the site?
Or another suggestions is always welcome.

I am pretty sure that

.entry-mini .box has to be used.

Greetings from Peter

Posted 1 year ago #
Dude
Dude

Did you upload a semi-transparent background image? You need to place it in the flashlight/images/skin-minimal/ folder and call it bg-trans.png. You can create a semi transparent image with Photoshop or Gimp.

Posted 1 year ago #
Petervdzee
Member

Hey Dude it worked! Through Firebug I tried to check the image but he returned: Page not Found.

The only thing I had to do was changing the link URL to: /wp-content/themes/huizenga/images/skin-minimal/transparant.png

Thanks for the great help. :-D

Greetings from Peter

Posted 1 year ago #