Jump to content
martinjrob

Carousel

Recommended Posts

martinjrob+    2
martinjrob

Hi I am having an issue with the Carousel colour which Catrina has tried to help me with but with no joy.

the carousel for some reason has decided to display a pink colour and i want it to be grey or just white, we have tried to change some of the css but still with no joy.

here is whet we have tried.

 


#page .section-carousel .content ul li a img, #page .section-carousel .content ul li a:hover img {box-shadow: 0 1px 4px #CCCCCC !important;}

 

#page .section-carousel .content ul li a img, #page .section-carousel .content ul li a:hover img {box-shadow: 0px !important;}

 

#page .section-carousel ul li a img {box-shadow: 0px !important;}

 

#page .section-carousel ul li a img {box-shadow: none !important;}

 

i dont really understand css, can anyone help me?

 

here is the website

 

http://www.planningserviceswarwickshire.co.uk/

 

many thanks.

Share this post


Link to post
Share on other sites
batman    389
batman

Hi martinjrob

You can try with

 

 

.section-carousel .thecarousel {
    background-color: #cccccc;
    background-image: -moz-linear-gradient(center top , #cccccc, #cccccc;
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    box-shadow: 1px 1px 0px #cccccc inset;}
 

 


Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
James B    436
James B

Thank you Batman :-) Let us know if that solution works for you Martin


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
batman    389
batman

Thank you for letting me answer James B...

:) 


Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
martinjrob+    2
martinjrob

Hi Batman

 

Thank you for the code but it's still showing as a pink colour.

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi,

 

 

I recommend using Firebug or your browsers built-in web dev tools and inspect the Carousel section to find the correct code.

 

For assistance visit our custom CSS documentation - http://support.pagelines.me/docs/customization/custom-css/

 

You will most likely need to use a PageLines override, I have provide below the correct elements and override to get you started. Apply your background, border etc.. to the code below and it should resolve your pink issue.

 

#site .section-carousel .thecarousel { }


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
martinjrob+    2
martinjrob

Hi Danny

 

Thanks for your reply but the problem i have is i am not sure what code i need to change and i am also not sure of what i am looking for using firebug.

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

You will need to inspect the Carousel, when you do go through each of the divs until you find where the pink is coming from (see image below).

http://cl.ly/image/3J252v1N460F

In the image above, I am using Google Chromes we dev tool, you can see the CSS which is used to give the carousel its pink color. You can use this code in the example I gave you in my previous post and replace the pink color with your preferred color.

 

There is a step by step guide on how to use the web dev tool on our custom CSS documentation.

 

http://support.pagelines.me/docs/customization/custom-css/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
martinjrob+    2
martinjrob

Hi 

I have tried the options you have given to me.

i have used the code

 

 

.section-carousel .thecarousel {
    background-color: #cccccc;
    background-image: -moz-linear-gradient(center top , #cccccc, #cccccc;
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    box-shadow: 1px 1px 0px #cccccc inset;}
 
I am now getting an error message
 
parse error: failed at `background-image: -moz-linear-gradient(center top , #cccccc, #cccccc; ` line: 984
 
please can someone help me and give me some advice on how i can fiw it.
thanks in advance Martin

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

A parse error means you have an error in your custom CSS. Therefore, you will need to inspect your custom CSS for any errors. From what I can see you're missing a closed ) in the background image code.

 

Also, a quick tip, that gradient CSS is for mozilla browsers, therefore, if you view your site in Chrome, Safari etc... there will be no gradient style. I recommend you view this site for getting the correct gradient code that will work in all browsers.

 

http://www.colorzilla.com/gradient-editor/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Similar Content

    • oseehys
      By oseehys+
      The Grams section of Platform 5, is lacking lots of important features, that DMS multigram was having, there is no space for another user ID asie the default user, that was one of the strongest point of multigrams, because the Hashtag option cannot capture everyone, multiple User ID is the default standard for Instagram,  Also there is no carousel or slide on this one, it means now that if you want to display 18 pictures in one page all will be visible at once thats not good engineering.
      My appeal to the Pagelines Team, guys please let the next update have all the DMS Multigrams features that is missing on Platform 5 Grams, that will bring it to its glory...
       
       
    • onlinedesigns4u
      By onlinedesigns4u+
      Hi Guys, 
       
      I noticed this a while back but thought it happened back when there was security issues with the wordpress plugin revolution slider and thats why they disappeared, but thinking i was wrong now as mine are the DMS versions.
       
      Basically, my front end editor is missing the icons for;
       
      • Rev Slider
      • Revolution Slider
      • Quick Slider
       

       
       
      What i've also noticed is a difference in how the menu tabs on the left hand side of the front end editor have changed. They were not styled like this before. Its like the css is off or something isnt quite right with the install somehow, somewhere.
       
      Even though the icons are missing for the slider sections. I can still drag them onto my pages and configure them, to a certain degree anyway.
       
      I tried adding the revolution slider to a page yesterday. But it wasnt responding to the way i had configured it. I choose a slide set for it to use and it took no notice. It just used every slide and every caption regardless.
       
      Leaving the revolution slider behind i took a look at the rev slider. Adding the correct images is fine. But i don't get any captions showing when i set them? Tried a few different options but nothing.
       
      Id like to know if my pagelines DMS 2 install is corrupt in anyway? Does anyone else's front end editor look the same as mine? Is anyone else missing the icons for the sliders and have no padding-right for the menu items?
       
      Is anyone using any of the sliders at the moment without issues?
       
      Im using the child theme 'Sophistique" which uses the revolution slider on the homepage. It works fine and its configured the way i want it using thh slide sets ive choosen so dont understand why it would be working inside the website.
       
      Any advice or help is appreciated. Thank for your time guys. Ben
       
       
       
    • dgsarnow
      By dgsarnow+
      I have DMS2 installed and my site is being served over HTTPS. However, I am getting an error that a placeholder image for Quick Carousel (which is not a being used on any of my pages) is being served over http://
       
      Mixed Content: The page at 'https://harqen.com/'was loaded over HTTPS, but requested an insecure image 'http://placehold.it/45x45/f0f0f0/ccc'. This content should also be served over HTTPS.
       
      How can I remove this?
       
      Found it. It was the Recent Posts Widget that was calling this little devil. I have removed the reference and all is well in SSL land.
    • dgsarnow
      By dgsarnow+
      I just updated to the new theme and I am now getting errors on my HTTPS site that the quick carousel is trying to deliver content through HTTP.
       
      Mixed Content: The page at 'https://harqen.com/'was loaded over HTTPS, but requested an insecure script 'http://harqen.com/wp-content/themes/dms/sections/quickcarousel/caroufredsel.js?ver=98ab90'. This request has been blocked; the content must be served over HTTPS.
       
      Can you please help me correct this issue?
       
       
    • Dave2
      By Dave2
      I added the PL Carousel to my homepage and it seems to switch the height when it changes the displayed image. I have the images all set to the same size (height & width) so I am not sure why the carousel does this. It is a bit distracting in that it makes the page jerk up/down when the slide changes. Do I need to add a fixed height element around the carousel to stop this behaviour or is there some other setting I should use?
×