What can we do to make it easier to design with Wild Apricot?

Custom HTML Code Being Removed Upon Save

I have a number of pages with custom <style> tags in the HTML. I add them by clicking Edit HTML on a specific page. I actually use them to override the user.css styles in the external style sheet.

Example - I have some flash code for a rotating image banner in my footer. I only want to show this on my home page. So in my user.css file I add a style rule that hides it for all pages:

#idflashimage{display; none;}
(I place the flash embed code inside a DIV that I have assigned an ID to and hide that)

Then on the Home page (or whatever page I want it to be shown) I add the following <style> tag:

<style>#idflashimage { display: block;}</style>

Prior to the update I was able to add the <style> tag, save the page and no problem. Now it seems that when I add a <style> tag to a page via Edit HTML and save it, the "Cleaning HTML" process deletes the whole tag.

Did the 4.0 update make it harder to insert custom HTML tags?


0 votes
Sign in
Password icon
Signed in as (Sign out)

We’ll send you updates on this idea

Kyle Mitchell shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →


Sign in
Password icon
Signed in as (Sign out)
  • Matthieu commented  ·   ·  Flag as inappropriate

    You CSS code needs to be added to the CSS Customization section under the Settings tab.

  • iphtc commented  ·   ·  Flag as inappropriate

    Hello I am trying to add some very simple jquery slider image rotation and I can't get to get the css saved. Everytime I put in the HTML code it kicks it out! How can I save the CSS to see my image slide?

  • Matthieu commented  ·   ·  Flag as inappropriate

    Since this isn't an actual HTML tag, it will always get removed by our editor. Any FBML that you need to add should be written to the page using JavaScript, like this:

    <script>document.write('<fb:like href="www.spec.bc.ca"></fb:like>');</script>

  • Kyle Mitchell commented  ·   ·  Flag as inappropriate

    Thanks Matthieu,

    That does sound like a much better way to do it. I realized my <style> tag was a very "hacky" way to do things, but it also seemed to work!

    A similar issue I encountered was when trying to add the Facebook Like button to my website via Javascript (http://developers.facebook.com/docs/reference/plugins/like ). They do have an iframe option, but it doesn't provide as much functionality.

    I figured out how to add another xmlns attribute to the HTML tag via global javascript.

    <script type="text/javascript">
    var htmlTAG = document.documentElement;
    var htmlTAG.setAttribute("xmlns:fb","http://www.facebook.com/2008/fbml")

    But then I need to add the following tag to each page Iwant the Like button on. I was thinking of putting it in the header, but again, upon saving from Edit HTML, this tag is deleted. Do you have any suggestions for this?

    <fb:like href="www.spec.bc.ca"></fb:like>

  • Matthieu commented  ·   ·  Flag as inappropriate

    Hello Kyle we have updated our HTML cleaning script - I will look into this. However, adding CSS in this way is no the best way to do it. You should instead add all the CSS to CSS Customization under the Settings tab. Each page on your website has a unique ID - if you log out and view the page souce you will see it near the top. For example, the ID for you home page is #PAGEID_520252

    So to show this div only on the home page, in your CSS Customization page, you would have the following:

    #idflashimage{display; none;}
    #PAGEID_520252 #idflashimage{display; block;}

Feedback and Knowledge Base