Can I remove the “display: none” parameter from the element code?
If you are working with Fundraise Up, you may have noticed that our typical element code includes HTML links formatted as follows:
1<a href="#XXXXXXXX" style="display: none"></a>
The Role of "display: none"
The Fundraise Up elements are often present on your webpage before our JavaScript library is fully loaded. In this period, any custom CSS settings you've implemented on your website could inadvertently style these HTML links, leading to unintended visual effects. By including the display:none
property, these element links remain hidden, thereby avoiding any visual disruptions. Once our library is loaded, it transforms these hidden links into the fully functional Fundraise Up elements, seamlessly integrating them into your website as intended.
Special Note for Webpage Editors Like Webflow
If you're using a webpage editor that has a live preview feature, such as Webflow, elements with display:none
might not be visible in the preview. In these situations, you can temporarily remove the display:none
attribute to see how the elements will look. However, it's crucial to reinstate it before publishing to ensure the elements function correctly in the live environment.
Why You Shouldn't Remove It
- Risk of Disruption: Omitting the
display:none
parameter exposes the links in a premature state, potentially causing visual inconsistencies on your website. - Perception of Loading Time: Without
display:none
, there might be an impression that the webpage is still loading or not fully operational, which could affect how your website is perceived.