Change Button Color

7 replies·opened May 31, 2016
A
annayoung1May 31, 2016
<a href="http://bryanandanna.com/"><i class="icon-angle-right"></i><span>Visit Website</span></a>
S
SemiColonWebSTAFFJun 2, 2016

Hello,

You can use the following code:

<a href="http://bryanandanna.com/" class="button button-3d" style="background-color: #444;"><i class="icon-angle-right"></i><span>Visit Website</span></a>

You can simply change the HEX Color Value from #444 to anything of your choice.

This will definitely work fine. Let us know if we can help you with anything else or if you find any further issues.

O
Ober24Jul 13, 2016

I have a similar question but this one is about file upload button. How to change the color of this Browse button? And how to write something else instead of Browse?

                &lt;div class="postcontent nobottommargin clearfix"&gt;
                    &lt;div class="row"&gt;
                        &lt;div class="col-md-7"&gt;
                            &lt;label&gt;Profilbild (freiwillig):&lt;/label&gt;&lt;br&gt;
                            &lt;input id="picture" name="picture" type="file" class="file" data-show-upload="false" data-show-caption="true" data-show-preview="true"&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
                &lt;/div&gt;&lt;!-- .postcontent end --&gt;
O
Ober24Jul 13, 2016

This is the actual button and i would like to change this blue color to red #BB0000

S
SemiColonWebSTAFFJul 13, 2016

Hello,

Adding a Custom HEX Color for the Upload Buttons is currently not supported. However, you can use the Bootstrap Buttons: http://getbootstrap.com/css/#buttons to define the Red Button. Please consider add the following JS Code at the bottom of the Page just after the js/functions.js JS File Linking:

<script type="text/javascript">
	jQuery(".custom-upload").fileinput({
		showCaption: false,
		browseClass: "btn btn-danger"
	});
</script>

This should definitely work fine. Let us know if we can help you with anything else or if you find any further issues.

O
Ober24Jul 14, 2016

that's cool i can make my own button with this and choose my own color...

S
SemiColonWebSTAFFJul 15, 2016

Hello,

Really Glad that your issues were resolved. Very Happy to Help! Thanks for your Patience.

Do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard