Webflow + Custom Code

Inline Coding Techniques

No items found.
Overview
Do You Remember?
Tracking w/ Cookies & Web Storage
100
Custom Code
HTML Encoding & Decoding
100
Custom Code Character Limit
101
Inline Coding Techniques
4:41
104
Inline CSS
4:41
104
Sygnal Webflow Utilities ( WFU )
Sygnal Webflow Utils ( WFU )
200
Helper Functions
202
No items found.

Useful Techniques

  • Use inline HTML Embeds with custom code, within collection list items to make small modifications to individual items.
  • Use IIFE's to protect your global variables.
  • Use self-element referencing and closest() to identify the collection item element easily.
<script>
(function() {
    var currentScript = document.currentScript;
    var link = currentScript.closest('a');
    if (link) {
        link.href = "#glossary-group-";
    }
})();
</script>

Resources

See an application of this technique in this cloneable;

https://webflow.com/made-in-webflow/website/glossary-headings

Table of Contents
Did we just make your life better?
Passion drives our long hours and late nights supporting the Webflow community. Click the button to show your love.