Discourse Help & Guides

DISCOURSE Guidelines

General Notes

  • BBCode to change the text color: [color=#2196F3]Your text here[/color]
  • BBCode to highlight the background of text: [background=#FFFF00]This text has a yellow background![/background]
  • For HTML version: This text has a yellow background! <span style=”background-color:#FFFF00;”>This text has a yellow background!</span>

1. Color Table with Visible Color Samples and BBCode

Color SampleColor NameBBCodeComments
Blue[color=#2196F3]Your text here[/color]A medium blue that is vibrant enough for both light and dark backgrounds.
Dark Blue[color=#1976D2]Your text here[/color]A darker blue that still stands out on both themes without being too intense.
Light Blue[color=#03A9F4]Your text here[/color]A lighter, refreshing blue suitable for readability in dark and light modes.
Green[color=#4CAF50]Your text here[/color]A medium green with good contrast for both dark and light backgrounds.
Dark Green[color=#388E3C]Your text here[/color]A darker green that provides visibility and a natural feel for both themes.
Yellow[color=#FFEB3B]Your text here[/color]A vibrant yellow that is bright enough for light mode but not too harsh for dark mode.
Dark Yellow[color=#FBC02D]Your text here[/color]A darker yellow that’s easier on the eyes in both light and dark modes, without overwhelming brightness.
Orange[color=#FF9800]Your text here[/color]A moderate orange that provides good contrast in both themes.
Pink[color=#E91E63]Your text here[/color]A rich pink that works well across both modes without clashing.
Purple[color=#9C27B0]Your text here[/color]A vibrant purple that contrasts well on both light and dark themes.
Dark Purple[color=#7B1FA2]Your text here[/color]A darker purple that adds depth without being too stark.
Red[color=#F44336]Your text here[/color]A bold red that stands out on dark backgrounds while remaining visible on light backgrounds.
Teal[color=#009688]Your text here[/color]A calm teal that offers good readability on both dark and light modes.
Gray[color=#9E9E9E]Your text here[/color]A neutral gray that can be used for softer text in both modes.
Light Gray[color=#BDBDBD]Your text here[/color]A light gray that’s soft but still readable, especially on dark backgrounds.
Black[color=#212121]Your text here[/color]A dark gray/black that ensures strong visibility on light backgrounds and smooth contrast on dark backgrounds.
White[color=#FFFFFF]Your text here[/color]White text can be used sparingly on dark backgrounds for high contrast. It’s hard to read on light backgrounds.

2. Highlight Colors (Similar to Microsoft Word Highlights)

Color SampleColor NameBBCodeComments
Yellow Highlight[color=#FFFF00]Your text here[/color]A bright yellow typically used to highlight text, works in both light and dark modes.
Light Yellow[color=#FFEB3B]Your text here[/color]A softer yellow often used for subtle highlights in both themes.
Orange Highlight[color=#FF5722]Your text here[/color]A vivid orange highlight that can make text pop, suitable for both modes.
Red Highlight[color=#F44336]Your text here[/color]A vivid orange highlight that can make text pop, suitable for both modes.
Green Highlight[color=#8BC34A]Your text here[/color]A fresh green highlight color that stands out well in both themes.
Teal Highlight[color=#00BCD4]Your text here[/color]A calm teal highlight that contrasts well in both modes.
Purple Highlight[color=#9C27B0]Your text here[/color]A vibrant purple for highlighting, ensuring visibility in both light and dark modes.
BlueHighlight[color=#2196F3]Your text here[/color]A vibrant purple for highlighting, ensuring visibility in both light and dark modes.

Symbols Table

SymbolHTML EntityDescription
®&reg;Registered Trademark
©&copy;Copyright
&trade;Trademark
&euro;Euro Symbol
£&poundPound Sterling
¥&yen;Yen Symbol
°&deg;Degree (°)
&rarr;Right Arrow (→)
&larr;Left Arrow (←)
&uarr;Up Arrow (↑)
&darrDown Arrow (↓)
±&plusmn;Plus-Minus Sign (±)
&ne;Not Equal (≠)
&le;Less Than or Equal (≤)
&ge;Greater Than or Equal (≥)
¼&frac14;Quarter Fraction (¼)
½&frac12;Half Fraction (½)
¾&frac34;Three-Quarters (¾)

Emoji Table

EmojiNameUnicode (HTML)
😀Grinning Face&#x1F600;
😂Face with Tears of Joy&#x1F602;
😍Heart Eyes&#x1F60D;
🤔Thinking Face&#x1F914;
😎Sunglasses&#x1F60E;
😁Beaming Face&#x1F601;
😜Face with Stuck-Out Tongue and Winking Eye&#x1F61C;
🙄Face with Rolling Eyes&#x1F644;
💥Collision&#x1F4A5;
🎉Party Popper&#x1F389;
❤️Red Heart&#2764;&#xFE0F;
💡Light Bulb&#x1F4A1;
🌟Glowing Star&#x1F31F;
🔥Fire&#x1F525;
🍕Pizza&#x1F355;
🍀Four Leaf Clover&#x1F340;
🌈Rainbow&#x1F308;
☀️Sun&#x2600;&#xFE0F;
🐱Cat Face&#x1F431;
🐶Dog Face&#x1F436;
🦄Unicorn&#x1F984;
🦊Fox Face&#x1F98A;
🐯Tiger Face&#x1F42F;
🦁Lion Face&#x1F981;
🐵Monkey Face&#x1F435;
🐸Frog Face&#x1F438;
🍎Red Apple&#x1F34E;
🍌Banana&#x1F34C;
🍓Strawberry&#x1F353;
🍉Watermelon&#x1F349;
🍊Orange&#x1F34A;
🍍Pineapple&#x1F34D;
🌍Globe Showing Europe-Africa&#x1F30D;
🌎Globe Showing Americas&#x1F30E;
🌏Globe Showing Asia-Australia&#x1F30F;
🌜Waning Crescent Moon&#x1F31C;
🌙First Quarter Moon&#x1F319;
Q: Will this CSS be tied only to this page, or can it be reused on other pages without having to add the Custom CSS to Elementor? See Question A below Inserting COLUMNS + Tables (individual pages, Not GLOBAL)
Symbol HTML Entity Description
® ® Registered Trademark
© © Copyright
Trademark
Euro Symbol
Emoji Name Unicode
😀 Grinning Face 😀
😂 Face with Tears of Joy 😂

1. Custom CSS within Elementor (for a specific page or widget):

  • When you add Custom CSS to the Advanced > Custom CSS section in a widget (like the Text Editor widget) in Elementor, it only applies to that specific widget or page.
  • If you need to reuse the same CSS across multiple pages or widgets, you would have to copy and paste the CSS code into each widget’s Custom CSS section. This is useful if the style is only relevant to one page or a specific widget.

2. Reusing the CSS on All Pages (Global Reusability):

If you want the same CSS styles to apply across your entire website (and not just one specific page or widget), you’ll need to place it in a global location where it applies everywhere. Here’s how to do that:
Option 1: Adding Custom CSS Globally in Elementor Settings

You can add custom CSS for the entire site using Elementor’s global settings:

    • Go to Elementor > Site Settings (in the WordPress Dashboard):
      • From your WordPress dashboard, go to Elementor > Site Settings.
    • Navigate to the Custom CSS Section:
      • Under Site Settings, click on Custom CSS.
    • Paste Your Custom CSS:
      • Paste the CSS code you want to apply globally across all pages.
    • Save Changes:
      • Click Save to apply the changes site-wide.

This will apply the CSS styles globally, meaning it will affect all pages and posts that use Elementor (and not just one specific widget).

Option 2: Using WordPress Customizer (for Global CSS)

Alternatively, you can add the CSS globally through WordPress’s built-in Customizer:

    • Go to the WordPress Customizer:
      • In your WordPress dashboard, go to Appearance > Customize.
    • Navigate to Additional CSS:
      • In the Customizer, find the Additional CSS section.
    • Paste Your Custom CSS:
      • Paste the CSS code that you want to apply to the entire site.
    • Publish:
      • Click Publish to save the changes, and the CSS will apply to the entire site.

Summary:

  • Specific Page/Widget: If you only add the CSS to the Advanced > Custom CSS section of a widget in Elementor, it will only apply to that page or widget.
  • Global Usage: If you want the CSS to be used across multiple pages (or the entire site), use the Site Settings or WordPress Customizer to add the CSS globally.
  • This way, you don’t need to manually paste the CSS into each page or widget every time.
®
Registered Trademark
©
Copyright
Trademark
😀
Grinning Face
😂
Face with Tears of Joy
😍
Heart Eyes

Clear & informative, that keeps it concise, professional, and consumer-friendly while emphasizing that the TMU offer is in addition to existing discounts (where appropriate)

Versions to choose or mix & match

  1. Extra 5% Off – TMU Exclusive
    Stackable with all site discounts, which are applied automatically.
  2. Additional 5% Off for TMU Consumers
  3. This exclusive discount applies on top of any site-wide sales, which are automatically applied in your cart.
  4. TMU Members: Additional 5% Off
    Site discounts are auto-applied in cart — TMU offer stacks on top.
  5. Bonus 5% Off for TMU Shoppers
    Site sales are already included in cart; TMU discount adds extra savings.

Example SleepEZ…

* Note that I mixed and matched some of the above
Offer/Discount Amount
Extra 5% Off  & Free Pillows – TMU Exclusive
Offer Details
This exclusive discount applies on top of any site-wide sales, which are automatically applied in your cart.
Discount Code
MUG5

Soon 

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

DISCOURSE Content Guides

I’ll use the example of Golden Dreams in the post here

Note that both @GoldenDreams notification pointer … AND …  their actual website/showroom link pointer should be in the post..

I did the same for all the Members mentioned in the post since that’s how we can show TMU’s worth. (See my screenshots with before and after edits)

Important #1: We need both pointers for each TM member,  in each post where we talk about our TMs, because:

  1. @GoldenDreams is a notification Pointer (they get notified, and this way they have a chance to answer the post)
  2.  Golden Dreams  link pointer
    • I can’t stress enough how important this second link is since that is what usually leads to a sale and acts as a validator for consumers
    • This is also how we collect our reports and views of how many clicks we give them.

Important #2:  For the members who have an affiliate system the Link(second pointer) must be either

  1. An affiliate link to a product (you need to navigate to their business profile to get those) … or
  2. Or the link to their TMU business profile link where all product affiliate links are listed.

Important #3: I know that Norm already does this, but please like the posts of our Trusted Members and all those between us. This will boost the algorithm of the Digest to include in the Newsletter the posts that are liked in the daily/weekly/monthly forum digests.  I would also like the post of the subscriber who asked the question, so that we encourage them to engage more. (Don’t do it if you feel that they may be a plant or have a hidden agenda) The more activity and posts we have, the more traction TMU gets on the WWW.

 

Symbols Table

SymbolHTML EntityDescription
®&reg;Registered Trademark
©&copy;Copyright
&trade;Trademark
&euro;Euro Symbol
£&poundPound Sterling
¥&yen;Yen Symbol
°&deg;Degree (°)
&rarr;Right Arrow (→)
&larr;Left Arrow (←)
&uarr;Up Arrow (↑)
&darrDown Arrow (↓)
±&plusmn;Plus-Minus Sign (±)
&ne;Not Equal (≠)
&le;Less Than or Equal (≤)
&ge;Greater Than or Equal (≥)
¼&frac14;Quarter Fraction (¼)
½&frac12;Half Fraction (½)
¾&frac34;Three-Quarters (¾)
&#10060;X symbol

Emoji Table

EmojiNameUnicode (HTML)
😀Grinning Face&#x1F600;
😂Face with Tears of Joy&#x1F602;
😍Heart Eyes&#x1F60D;
🤔Thinking Face&#x1F914;
😎Sunglasses&#x1F60E;
😁Beaming Face&#x1F601;
😜Face with Stuck-Out Tongue and Winking Eye&#x1F61C;
🙄Face with Rolling Eyes&#x1F644;
💥Collision&#x1F4A5;
🎉Party Popper&#x1F389;
❤️Red Heart&#2764;&#xFE0F;
💡Light Bulb&#x1F4A1;
🌟Glowing Star&#x1F31F;
🔥Fire&#x1F525;
🍕Pizza&#x1F355;
🍀Four Leaf Clover&#x1F340;
🌈Rainbow&#x1F308;
☀️Sun&#x2600;&#xFE0F;
🐱Cat Face&#x1F431;
🐶Dog Face&#x1F436;
🦄Unicorn&#x1F984;
🦊Fox Face&#x1F98A;
🐯Tiger Face&#x1F42F;
🦁Lion Face&#x1F981;
🐵Monkey Face&#x1F435;
🐸Frog Face&#x1F438;
🍎Red Apple&#x1F34E;
🍌Banana&#x1F34C;
🍓Strawberry&#x1F353;
🍉Watermelon&#x1F349;
🍊Orange&#x1F34A;
🍍Pineapple&#x1F34D;
🌍Globe Showing Europe-Africa&#x1F30D;
🌎Globe Showing Americas&#x1F30E;
🌏Globe Showing Asia-Australia&#x1F30F;
🌜Waning Crescent Moon&#x1F31C;
🌙First Quarter Moon&#x1F319;
Q: Will this CSS be tied only to this page, or can it be reused on other pages without having to add the Custom CSS to Elementor? See Question A below Inserting COLUMNS + Tables (individual pages, Not GLOBAL)
Symbol HTML Entity Description
® ® Registered Trademark
© © Copyright
Trademark
Euro Symbol
Emoji Name Unicode
😀 Grinning Face 😀
😂 Face with Tears of Joy 😂

1. Custom CSS within Elementor (for a specific page or widget):

  • When you add Custom CSS to the Advanced > Custom CSS section in a widget (like the Text Editor widget) in Elementor, it only applies to that specific widget or page.
  • If you need to reuse the same CSS across multiple pages or widgets, you would have to copy and paste the CSS code into each widget’s Custom CSS section. This is useful if the style is only relevant to one page or a specific widget.

2. Reusing the CSS on All Pages (Global Reusability):

If you want the same CSS styles to apply across your entire website (and not just one specific page or widget), you’ll need to place it in a global location where it applies everywhere. Here’s how to do that:
Option 1: Adding Custom CSS Globally in Elementor Settings

You can add custom CSS for the entire site using Elementor’s global settings:

    • Go to Elementor > Site Settings (in the WordPress Dashboard):
      • From your WordPress dashboard, go to Elementor > Site Settings.
    • Navigate to the Custom CSS Section:
      • Under Site Settings, click on Custom CSS.
    • Paste Your Custom CSS:
      • Paste the CSS code you want to apply globally across all pages.
    • Save Changes:
      • Click Save to apply the changes site-wide.

This will apply the CSS styles globally, meaning it will affect all pages and posts that use Elementor (and not just one specific widget).

Option 2: Using WordPress Customizer (for Global CSS)

Alternatively, you can add the CSS globally through WordPress’s built-in Customizer:

    • Go to the WordPress Customizer:
      • In your WordPress dashboard, go to Appearance > Customize.
    • Navigate to Additional CSS:
      • In the Customizer, find the Additional CSS section.
    • Paste Your Custom CSS:
      • Paste the CSS code that you want to apply to the entire site.
    • Publish:
      • Click Publish to save the changes, and the CSS will apply to the entire site.

Summary:

  • Specific Page/Widget: If you only add the CSS to the Advanced > Custom CSS section of a widget in Elementor, it will only apply to that page or widget.
  • Global Usage: If you want the CSS to be used across multiple pages (or the entire site), use the Site Settings or WordPress Customizer to add the CSS globally.
  • This way, you don’t need to manually paste the CSS into each page or widget every time.
®
Registered Trademark
©
Copyright
Trademark
😀
Grinning Face
😂
Face with Tears of Joy
😍
Heart Eyes

Clear & informative, that keeps it concise, professional, and consumer-friendly while emphasizing that the TMU offer is in addition to existing discounts (where appropriate)

Versions to choose or mix & match

  1. Extra 5% Off – TMU Exclusive
    Stackable with all site discounts, which are applied automatically.
  2. Additional 5% Off for TMU Consumers
  3. This exclusive discount applies on top of any site-wide sales, which are automatically applied in your cart.
  4. TMU Members: Additional 5% Off
    Site discounts are auto-applied in cart — TMU offer stacks on top.
  5. Bonus 5% Off for TMU Shoppers
    Site sales are already included in cart; TMU discount adds extra savings.

Example SleepEZ…

* Note that I mixed and matched some of the above
Offer/Discount Amount
Extra 5% Off  & Free Pillows – TMU Exclusive
Offer Details
This exclusive discount applies on top of any site-wide sales, which are automatically applied in your cart.
Discount Code
MUG5

Soon 

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.