MathJax affects GitHub Gist

Make sure you go through the Hexo docs, Icarus user manual, and GitHub issues to see if the bug you are reporting has been already addressed by others.

✅

Describe the bug I have MathJax turned on in my config file. When I embed a GitHub Gist in a post, MathJax is applied to the embedded Gist. MathJax should not be applied to the content of the Gist.

System and Environment Hexo version 5.4.0 (commit 2ae643a6) Icarus version 4.2.0 (commit efc756a5)

• Hexo, OS, and node version (use hexo version command to view these information)

hexo: 5.4.0
hexo-cli: 4.2.0
os: Windows_NT 10.0.19043 win32 x64
node: 12.16.1
v8: 7.8.279.23-node.31
uv: 1.34.0
zlib: 1.2.11
brotli: 1.0.7
ares: 1.15.0
modules: 72
nghttp2: 1.40.0
napi: 5
llhttp: 2.0.4
http_parser: 2.9.3
openssl: 1.1.1d
cldr: 35.1
icu: 64.2
tz: 2019c
unicode: 12.1

• Site configuration file _config.yml

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
## Icarus home page md: https://raw.githubusercontent.com/ppoffice/hexo-theme-icarus/site/source/_posts/zh-CN/Getting-Started.md

# Site
title: Red Peregrine
subtitle: Carl Scarlett's Blog
description: Red Peregrine is the blog site of Carl Scarlett
author: Carl Scarlett
language: en
timezone: ''

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://www.redperegrine.net
root: /
permalink: :title/
permalink_defaults: null

pretty_urls:
  trailing_index: true
  trailing_html: true

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render: null

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
  enable: true  # Open external links in new tab
  field: site
  exclude: ''
filename_case: 1
render_drafts: false
post_asset_folder: true
relative_link: false
future: true
highlight:
  enable: true
  line_number: true
  auto_detect: false
  tab_replace: '    '
  wrap: false
  hljs: false
prismjs:
  enable: false
  preprocess: true
  line_number: true
  tab_replace: ''

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 5
  order_by: '-date'

# Category & Tag
default_category: uncategorized
category_map: null
tag_map: null
meta_generator: true

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
updated_option: mtime

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Include/Exclude Files or Folders
## Use glob expressions to include/exclude additional files
# include: null
# exclude: null
# ignore: null

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: icarus

# RSS
## npm install hexo-generator-feed --save
feed:
  type: atom
  path: atom.xml
  limit: 50
  # hub:
  content:
  content_limit: 280
  content_limit_delim: ' '
  order_by: -date
  icon: /img/personal-blog/favicon.svg
  autodiscovery: false
  # template:

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: withheld
  branch: master

# Emojis
## https://github.com/crimx/hexo-filter-github-emojis
githubEmojis:
  enable: true
  className: github-emoji
  inject: true
  unicode: false
  styles:
  localEmojis:

# Sitemap
## https://github.com/ludoviclefevre/hexo-generator-seo-friendly-sitemap
sitemap:
    path: sitemap.xml

• Theme configuration file _config.icarus.yml or themes/icarus/_config.yml

# Version of the configuration file
version: 4.0.0
# Icarus theme variant, can be "default" or "cyberpunk"
variant: default
# Path or URL to the website's logo
logo: /img/personal-blog/logo.svg
# Page metadata configurations
head:
    # URL or path to the website's icon
    favicon: /img/personal-blog/favicon.svg

    # # Web application manifests configuration
    # # https://developer.mozilla.org/en-US/docs/Web/Manifest
    # manifest:
    #     # Name of the web application (default to the site title)
    #     name: 
    #     # The displayed name of the web application
    #     # when there is not enough space to display full name
    #     short_name: 
    #     # The start URL of the web application
    #     start_url: 
    #     # The default theme color for the application
    #     theme_color: 
    #     # A placeholder background color for the application page to display
    #     # before its stylesheet is loaded
    #     background_color: 
    #     # The preferred display mode for the website
    #     display: standalone
    #     # Image files that can serve as application icons for different contexts
    #     icons:
    #         -
    #             # The path to the image file
    #             src: ''
    #             # A string containing space-separated image dimensions
    #             sizes: ''
    #             # A hint as to the media type of the image
    #             type: 

    # # Open Graph metadata
    # # https://hexo.io/docs/helpers.html#open-graph
    # open_graph:
    #     # Page title (og:title) (optional)
    #     # You should leave this blank for most of the time
    #     title: 
    #     # Page type (og:type) (optional)
    #     # You should leave this blank for most of the time
    #     type: blog
    #     # Page URL (og:url) (optional)
    #     # You should leave this blank for most of the time
    #     url: 
    #     # Page cover (og:image) (optional)
    #     # You should leave this blank for most of the time
    #     image: 
    #     # Site name (og:site_name) (optional)
    #     # You should leave this blank for most of the time
    #     site_name: 
    #     # Page author (article:author) (optional)
    #     # You should leave this blank for most of the time
    #     author: 
    #     # Page description (og:description) (optional)
    #     # You should leave this blank for most of the time
    #     description: 
    #     # Twitter card type (twitter:card)
    #     twitter_card: 
    #     # Twitter ID (twitter:creator)
    #     twitter_id: 
    #     # Twitter Site (twitter:site)
    #     twitter_site: 
    #     # Google+ profile link (deprecated)
    #     google_plus: 
    #     # Facebook admin ID
    #     fb_admins: 
    #     # Facebook App ID
    #     fb_app_id: 

    # Structured data of the page
    # https://developers.google.com/search/docs/guides/intro-structured-data
    structured_data:
        # Page title (optional)
        # You should leave this blank for most of the time
        title: 
        # Page description (optional)
        # You should leave this blank for most of the time
        description: 
        # Page URL (optional)
        # You should leave this blank for most of the time
        url: 
        # Page author (article:author) (optional)
        # You should leave this blank for most of the time
        author: 
        # Page publisher (optional)
        # You should leave this blank for most of the time
        publisher: 
        # Page publisher logo (optional)
        # You should leave this blank for most of the time
        publisher_logo: 
        # Page images (optional)
        # You should leave this blank for most of the time
        image: 

    # Additional HTML meta tags in an array
    meta:
        # Meta tag specified in <attribute>=<value> style
        # E.g., name=theme-color;content=#123456 => <meta name="theme-color" content="#123456">
        -  google-site-verification=withheld
        -  rating=safe for kids    # https://developers.google.com/search/docs/advanced/guidelines/google-images#safe_search, https://www.metatags.org/all-meta-tags-overview/meta-name-rating/
    # URL or path to the website's RSS atom.xml
    rss: 
# Page top navigation bar configurations
navbar:
    # Navigation menu items
    menu:
        Home: /
        Archives: /archives
        # Categories: /categories
        # Tags: /tags
        About: /about
    # Links to be shown on the right of the navigation bar
    # links:
    #     Download on GitHub:
    #         icon: fab fa-github
    #         url: 'https://github.com/ppoffice/hexo-theme-icarus'
# Page footer configurations
footer:
    # Links to be shown on the right of the footer section
    links:
        Creative Commons:
            icon: fab fa-creative-commons
            url: 'https://creativecommons.org/'
        Attribution 4.0 International:
            icon: fab fa-creative-commons-by
            url: 'https://creativecommons.org/licenses/by/4.0/'
        Download on GitHub:
            icon: fab fa-github
            url: 'https://github.com/ppoffice/hexo-theme-icarus'
# Article related configurations
article:
    # Code highlight settings
    highlight:
        # Code highlight themes
        # https://github.com/highlightjs/highlight.js/tree/master/src/styles
        # CDN: https://cdn.jsdelivr.net/npm/highlight.js@11.0.1/styles
        theme: base16/oceanicnext
        # Show copy code button
        clipboard: true
        # Default folding status of the code blocks. Can be "", "folded", "unfolded"
        fold: unfolded
    # Whether to show estimated article reading time
    readtime: true
    # Article licensing block
    licenses:
        Creative Commons:
            icon: fab fa-creative-commons
            url: 'https://creativecommons.org/'
        Attribution:
            icon: fab fa-creative-commons-by
            url: 'https://creativecommons.org/licenses/by/4.0/'
        Noncommercial:
            icon: fab fa-creative-commons-nc
            url: 'https://creativecommons.org/licenses/by-nc/4.0/'
# Search plugin configurations
# https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Search/
search:
    type: insight
# Comment plugin configurations
# https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Comment/
comment:
    type: disqus
    # Disqus shortname
    shortname: withheld

# # Donate plugin configurations
# # https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Donation/
# donates:
#     # "Afdian.net" donate button configurations
#     -
#         type: afdian
#         # URL to the "Afdian.net" personal page
#         url: ''
#     # Alipay donate button configurations
#     -
#         type: alipay
#         # Alipay qrcode image URL
#         qrcode: ''
#     # "Buy me a coffee" donate button configurations
#     -
#         type: buymeacoffee
#         # URL to the "Buy me a coffee" page
#         url: ''
#     # Patreon donate button configurations
#     -
#         type: patreon
#         # URL to the Patreon page
#         url: ''
#     # Paypal donate button configurations
#     -
#         type: paypal
#         # Paypal business ID or email address
#         business: ''
#         # Currency code
#         currency_code: USD
#     # Wechat donate button configurations
#     -
#         type: wechat
#         # Wechat qrcode image URL
#         qrcode: ''

# # Share plugin configurations
# # https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Share/
# share:
#     type: sharethis
#     # URL to the ShareThis share plugin script
#     install_url: ''

# Sidebar configurations.
# Please be noted that a sidebar is only visible when it has at least one widget
sidebar:
    # Left sidebar configurations
    left:
        # Whether the sidebar sticks to the top when page scrolls
        sticky: true
    # Right sidebar configurations
    right:
        # Whether the sidebar sticks to the top when page scrolls
        sticky: false

# Sidebar widget configurations
# http://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/
widgets:
    # Profile widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: left
        type: profile
        # Author name
        author: Carl Scarlett
        # Author title
        author_title: Designer, Developer, Dreamer, Doer
        # Author's current location
        location: Perth, Western Australia
        # URL or path to the avatar image
        avatar: 
        # Whether show the rounded avatar image
        avatar_rounded: true
        # Email address for the Gravatar
        gravatar: withheld
        # URL or path for the follow button
        follow_link: 'https://twitter.com/ZodmanPerth'
        # Links to be shown on the bottom of the profile widget
        social_links:
            Github:
                icon: fab fa-github
                url: 'https://github.com/ZodmanPerth'
            Twitter:
                icon: fab fa-twitter
                url: 'https://twitter.com/ZodmanPerth'
            LinkedIn:
                icon: fab fa-linkedin
                url: 'https://www.linkedin.com/in/carlscarlett/'
            YouTube:
                icon: fab fa-youtube
                url: 'https://www.youtube.com/user/ZodmanPerth'
            RSS:
                icon: fas fa-rss
                url: /atom.xml

    # Table of contents widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: left
        type: toc
        # Whether to show the index of each heading
        index: true
        # Whether to collapse sub-headings when they are out-of-view
        collapsed: false
        # Maximum level of headings to show (1-6)
        depth: 3

    # Recent posts widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: recent_posts

    # # Google FeedBurner email subscription widget configurations
    # # Feedburner is going into maintenance mode: https://github.com/ppoffice/hexo-theme-icarus/issues/863
    # -
    #     # Where should the widget be placed, left sidebar or right sidebar
    #     position: right
    #     type: subscribe_email
    #     # Hint text under the email input
    #     description: 
    #     # Feedburner ID
    #     feedburner_id: ''

    # Archives widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: archives

    # Categories widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: categories

    # Tags widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: tags

    # Recommendation links widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: links
        # Names and URLs of the sites
        links:
            Godot: 'https://godotengine.org/'
            Win2D: 'https://github.com/Microsoft/Win2D'
            BenchmarkDotNet: 'https://github.com/dotnet/BenchmarkDotNet'
            LINQPad: 'https://www.linqpad.net/'

    # # Google AdSense unit configurations
    # -
    #     # Where should the widget be placed, left sidebar or right sidebar
    #     position: left
    #     type: adsense
    #     # AdSense client ID
    #     client_id: ''
    #     # AdSense AD unit ID
    #     slot_id: ''

# Plugin configurations
# https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/
plugins:
    # Enable page startup animations
    animejs: false
    # Show the "back to top" button
    back_to_top: true
    # Baidu Analytics plugin settings
    # https://tongji.baidu.com
    baidu_analytics:
        # Baidu Analytics tracking ID
        tracking_id: 
    # Bing Webmaster Tools plugin settings
    # https://www.bing.com/toolbox/webmaster/
    bing_webmaster:
        # Bing Webmaster Tools tracking ID in the <meta> tag
        tracking_id: 
    # BuSuanZi site/page view counter
    # https://busuanzi.ibruce.info
    busuanzi: true
    # CNZZ statistics
    # https://www.umeng.com/web
    cnzz:
        # CNZZ tracker id
        id: 
        # CNZZ website id
        web_id: 
    # Alerting users about the use of cookies
    # https://www.osano.com/cookieconsent/
    cookie_consent:
        # The compliance type. Can be "info", "opt-in", or "opt-out"
        type: info
        # Theme of the popup. Can be "block", "edgeless", or "classic"
        theme: edgeless
        # Whether the popup should stay static regardless of the page scrolls
        static: false
        # Where on the screen the consent popup should display
        position: bottom-left
        # URL to your site's cookie policy
        policyLink: 'https://www.cookiesandyou.com/'
    # Enable the lightGallery and Justified Gallery plugins
    gallery: false
    # Google Analytics plugin settings
    # https://analytics.google.com
    google_analytics:
        # Google Analytics tracking ID
        tracking_id: 
    # Hotjar user feedback plugin
    # https://www.hotjar.com/
    hotjar:
        # Hotjar site id
        site_id: 
    # Enable the KaTeX math typesetting support
    # https://katex.org/
    katex: false
    # Enable the MathJax math typesetting support
    # https://www.mathjax.org/
    mathjax: true
    # Enable the Outdated Browser plugin
    # http://outdatedbrowser.com/
    outdated_browser: false
    # Show a progress bar at top of the page on page loading
    progressbar: true
    # Statcounter statistics
    # https://statcounter.com/
    statcounter:
        # Statcounter project id
        project: 
        # Statcounter project security code
        security: 
    # Twitter conversion tracking plugin settings
    # https://business.twitter.com/en/help/campaign-measurement-and-analytics/conversion-tracking-for-websites.html
    twitter_conversion_tracking:
        # Twitter Pixel ID
        pixel_id: 
# CDN provider settings
# https://ppoffice.github.io/hexo-theme-icarus/Configuration/Theme/speed-up-your-site-with-custom-cdn/
providers:
    # Name or URL template of the JavaScript and/or stylesheet CDN provider
    cdn: jsdelivr
    # Name or URL template of the webfont CDN provider
    fontcdn: google
    # Name or URL of the fontawesome icon font CDN provider
    iconcdn: fontawesome

• Any additional theme configuration files (post front-matter, _config.post.yml, or _config.page.yml) Not applicable

• Browser and version (e.g., Firefox 70.0, Chrome Android 80.0) Google Chrome (Windows) Version 92.0.4515.131 (Official Build) (64-bit)

To Reproduce Steps to reproduce the behavior:

I have created a public Gist demonstrating the issue.

1. Create post on a Hexo site with the Icarus Theme with Mathjax turned on
2. Add the following embedded Gist code:

<script src="https://gist.github.com/ZodmanPerth/ce90e1ac74276f5e30f0905c71a91c5d.js?file=Sample.js"></script>

1. Generate, serve, and open the post
2. Observe the page will show a post with an embedded Gist, however the contents of the Gist will be affected by MathJax.

Expected behavior The embedded Gist should not be affected by MathJax

Screenshots If applicable, add screenshots to help explain your problem. The embedded gist, as shown on the post:

Right clicking the MathJax in the Gist:

The actual content of the Gist (what should be displayed):

Additional context Add any other context about the problem here. I have tried several methods for preventing the MathJax from applying to the Gist.

• Surrounded the script tag in $$
• Surrounded the script tag in a <div> </div>
• Surrounded the script tag in a <div> </div> and a $$
• Modified the configuration of MathJax to include an ignore class for tex2jax, and surrounded the script in a <div class="zodIgnoreMathJax"> :

<script type="text/x-mathjax-config;executed=true">MathJax.Hub.Config({
            'HTML-CSS': {
                matchFontHeight: false
            },
            SVG: {
                matchFontHeight: false
            },
            CommonHTML: {
                matchFontHeight: false
            },
            tex2jax: {
                ignoreClass: "zodIgnoreMathJax",
                inlineMath: [
                    ['$','$'],
                    ['\\(','\\)']
                ]
            }
        });</script>

Please let me know if there is a way to turn off MathJax processing for part of the post.

[ppoffice]

@ZodmanPerth It turns out that your code is parsed as ASCIIMath notations instead of TeX. Using asciimath2jax_ignore as class name will prevent your code from being processed by MathJax.

<div class="asciimath2jax_ignore">
    <script src="https://gist.github.com/ZodmanPerth/ce90e1ac74276f5e30f0905c71a91c5d.js?file=Sample.js"></script>
</div>

If you are not sure which preprocessor MathJax will use, just add all ignored class names to your wrapper:

<div class="tex2jax_ignore asciimath2jax_ignore">
    <script src="https://gist.github.com/ZodmanPerth/ce90e1ac74276f5e30f0905c71a91c5d.js?file=Sample.js"></script>
</div>

[ZodmanPerth]

That works!

Thank you very much. I don’t know how MathJax processing works and I didn’t find any information about the asciimath2jax_ignore class when I tried to solve this issue on my own. I really appreciate the guidance you’ve provided.