Red "x"s in line number column of CSS code

  • Resolved Mark

    (@markyork)


    9 years, 2 months ago

    I just purchased CJT Premium and am learning how to use it with a test site.

    For my first try I added a simple CSS code block to color an h2 tag:

    <style type="text/css">
    h2 {
        color: blue; }
</style>

    It works, but in the left column, next to the line numbers are red “x”s on lines 1 & 4. Mousing over them, the errors are all (except for one) “unexpected token”s. Here are the errors:

    The X at line one has:

    Unexpected token ‘<‘ at line 1, column 1
    Expected LBRACE @ line 1, column 12
    Unexpected token ‘=’ at line 1, column 12
    Unexpected token ‘”text/css”‘ at line 1, column 13
    Unexpected token ‘>’ at line 1, column 23

    The X at line four has:

    Unexpected token ‘<‘ at line 4, column 1
    Unexpected token ‘/’ at line 4, column 2
    Unexpected token ‘null’ at line 4, column 9

    It has been a while since I actually coded in the <head> tag, so I even looked that up to make sure my syntax, etc was right for the header.

    Am I missing something here?

    https://www.ads-software.com/plugins/css-javascript-toolbox/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author wipeoutmedia

    (@wipeoutmedia)

    Hi Mark,

    Thanks for your support question.
    Did you change the editor to CSS so the parser looks for valid CSS code?
    Hover over a button that says ‘Set editing language for syntax highlighting’

    Regards,
    Damian

    Thread Starter Mark

    (@markyork)

    Hi Damian,

    Yes, I had CSS selected in the toolbar. However, I noticed that when I clicked on HTML the error indicators went away. Which actually make sense, as my code is in <style> tags, so it is really HTML, not CSS. So I have that straightened out.

    But when I first started out I had CSS selected in the toolbar and for the code I only wrote the actual styling code: h2 { color: blue; }. That didn’t produce any errors, but it didn’t work either (the h2 tags on the affected page weren’t colored blue).

    Actually, a bigger question comes to mind: if the code written in the code blocks can only be put in the header or footer, as the “Output Location Hook” button indicates, then when would you use only CSS in a code block? Or am I not understanding something here.

    Thanks,
    Mark

    Plugin Author wipeoutmedia

    (@wipeoutmedia)

    Hi Mark,

    Glad you got that worked out. ??

    As for code block assignments, there are three main ways to assign the code blocks, being:
    – in the Header of the page/post
    – in the Footer of the page/post
    – CJT Shortcodes using the page/post editor

    The shortcodes option gives you more pinpoint accuracy in code block placement because these are placed in the Page/Post using the editor. You can utilise any of the three methods for your CSS if you like.
    Sometimes keeping just CSS code in a code block is good for overall code management. Also, when using the Header/Footer location hook, the code blocks are output in the order they are in. The code blocks are hierarchical, meaning they are executed in the order from top to bottom, where higher-ordered code blocks will override lower-ordered ones. This can be good for CSS code blocks overriding others.

    Hope this helps.

    Regards,
    Damian

    Thread Starter Mark

    (@markyork)

    I understand now.

    Thanks for clearing that up.

    Mark

    Plugin Author wipeoutmedia

    (@wipeoutmedia)

    Glad to be of help

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Red "x"s in line number column of CSS code’ is closed to new replies.

Tags