Joomla Templates Club 406,261 posts

[optimized Friend optimizedJoin date: July 2010Posts: 34Downloads:0Uploads:6 Thanks: 2]

#200928

Hi ,

I want to change the color of the boxes on the slideshow to #E7017D

I am using the default template

Which file and code should Ichnage to do this?

Thanks,

Mike

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#547722

Hello can you share a screenshot what part of color you want to change
by default that boxes bg is in black color , and on hover they become orange red color .
Let me know which one you like to change , i will tell you solution .

[optimized Friend optimizedJoin date: July 2010Posts: 34Downloads:0Uploads:6 Thanks: 2]

#547723

Hi, I would like to change the background upon hover to #E7017D

Thanks,

Mike

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#547729

<em>@optimized 443525 wrote:</em><blockquote>Hi, I would like to change the background upon hover to #E7017D
</blockquote>

Go to templatesja_bizcssmod_jaslidshow

find

.ja-slidewrap .maskDesc .ja-slide-desc a:hover,
.ja-slidewrap .maskDesc .ja-slide-desc a:focus,
.ja-slidewrap .maskDesc .ja-slide-desc a:active {
color: #f2735a;
text-decoration: none;
}

change it into

.ja-slidewrap .maskDesc .ja-slide-desc a:hover,
.ja-slidewrap .maskDesc .ja-slide-desc a:focus,
.ja-slidewrap .maskDesc .ja-slide-desc a:active {
color: #E7017D;
text-decoration: none;
}

switch OFF the development mod from template options .clear cache
Let me know if it helps .

[optimized Friend optimizedJoin date: July 2010Posts: 34Downloads:0Uploads:6 Thanks: 2]

#547732

Hello, I did as you suggested and switched off Development Mode in the Spanish Home template but, as yuo can see in the attached image, the template gets spoiled

The new text colour remains but Development Mode is now turned off on the website as it is live

What else can you suggest?

Thanks,

Mike

Can .

---

Attachments:

1. 

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#547740

Hello development Mode is used to editing the less files .
so if you edited the less files for changes and after that you want to use css file .
in that case use compile less to css , to implement all the changes of less into css files .
take a backup of your site and after that you can apply above suggestion .

[optimized Friend optimizedJoin date: July 2010Posts: 34Downloads:0Uploads:6 Thanks: 2]

#547764

Hi, I did not edit any less files, I just change the code below in Go to templatesja_bizcssmod_jaslidshow

The colour has not changed on the website – what do I do now?

Thanks,

Mike

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#547794

Hello can you take a backup of your site . and PM me your working admin credentials , so that i can check it on your site

[optimized Friend optimizedJoin date: July 2010Posts: 34Downloads:0Uploads:6 Thanks: 2]

#547957

Admin details sent

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#548052

HI i need you FTP site details . Please check your PM ,
send me FTP details so that i can edit the css files and let you know the solution

[optimized Friend optimizedJoin date: July 2010Posts: 34Downloads:0Uploads:6 Thanks: 2]

#548144

FTP details sent by PM

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#548173

Hello i changed the color directly on your site as per your need .
Here are the changes .
go to template/your templare/less/ modslideshow.less

i change this code

// Active
.active {
.ja-slide-thumb-inner {
background: @brand-primary;
border-color: @brand-primary;
color: @white;
}
}
into


// Active
.active {
.ja-slide-thumb-inner {
background: #E7017D
border-color: #E7017D
color: @white;
}
}

Hope it helps you

[Author]

Posts