Action link as a button

Having the option to have an Action Link as a button, both in Display Object view but in Menus too.

Hi Julian! This worked great! Thank you! The only trouble I am having now is that when I embed in the app into my website the website css overrides the button css. So, I am trying to work through that issue and hopefully I can get that to work. 

Hi Renee

I'm doing this differently myself now - I use an HTML button:



<button type="button" class='blueButton'>Edit</button>

 

and the CSS:

 

.blueButton {
    background: #88aee8;
    border: 0px solid #88aee8;
    border-radius: 4px;
    padding: 10px 30px;
    color: #ffffff;
    display: inline-block;
    font: normal 500 14px/1 "Calibri", sans-serif;
    text-align: center;
    text-shadow: none;
}

Julian, thanks for this information. I too am trying to make an Action Link into a button. However, I am not strong at all with CSS. I am attempting this using your example but it isn't working. I am sure it is me since I really don't know much about CSS. If you or anyone could answer the basic question of what the '#' is supposed to be? Is it the url of the page or the scene # or view #? I would appreciate any help.

I think its better to use <span> isntead of <a> so we dont loose our links! Thanks for the hint!

Hi Tony

Effectively you can do this with CSS - although I agree it would be better as a simple option in the UI.

If you put the following in the Link Text Field (as an example):

<a href='#' class='approveButton'>Approve this</a>

you can then add some CSS to modify the appearance - here's a simple example:

.approveButton {
  background: #f3f3f3;
  border: 1px solid #556699;
  border-radius: 4px;
  padding: 5px 20px;
  color: #0b5394;
  display: inline-block;
  font: normal 400 14px/1 "Calibri", sans-serif;
  text-align: center;
  text-shadow: none;
}

Hope this helps!