{"id":554,"date":"2023-09-08T12:07:48","date_gmt":"2023-09-08T12:07:48","guid":{"rendered":"https:\/\/help.kybernaut.cz\/?post_type=ht_kb&p=554"},"modified":"2023-09-08T12:42:21","modified_gmt":"2023-09-08T12:42:21","slug":"how-to-access-the-browsers-developer-console","status":"publish","type":"ht_kb","link":"https:\/\/help.kybernaut.cz\/en\/help\/how-to-access-the-browsers-developer-console\/","title":{"rendered":"How to access the browser’s developer console"},"content":{"rendered":"\n

Occasionally, you might be asked to assist with identifying and fixing problems related to how a website or admin panel behaves. These problems might not immediately display errors, but they could be lurking in the background, causing the plugin to not work as expected. One useful tool that can help us both understand what’s happening is your browser’s developer or JavaScript console. <\/p>\n\n\n\n

Let’s explore how to access it on most modern web browsers.<\/p>\n\n\n\n

Google Chrome<\/strong><\/h2>\n\n\n\n
    \n
  1. Open Chrome.<\/li>\n\n\n\n
  2. Click the three vertical dots in the upper right corner (menu icon).<\/li>\n\n\n\n
  3. Go to “More tools” and select “Developer tools.” You can also use the keyboard shortcut Ctrl + Shift + I<\/code> or Cmd + Option + I<\/code> (on Mac).<\/li>\n<\/ol>\n\n\n
    \n
    \"\"<\/figure>\n<\/div>\n\n\n
      \n
    1. The console will either open up within your existing Chrome window, or in a new window. You may have to select the Console tab.<\/li>\n<\/ol>\n\n\n
      \n
      \"\"<\/figure>\n<\/div>\n\n\n

      Safari<\/strong><\/h2>\n\n\n\n
        \n
      1. Open Safari.<\/li>\n\n\n\n
      2. Go to “Safari” in the top menu.<\/li>\n\n\n\n
      3. Select “Preferences.”<\/li>\n\n\n\n
      4. Click on the “Advanced” tab.<\/li>\n\n\n\n
      5. Check the box next to “Show Develop menu in menu bar.”<\/li>\n<\/ol>\n\n\n
        \n
        \"\"<\/figure>\n<\/div>\n\n\n
          \n
        1. You’ll now see a “Develop” menu in the top menu bar. Click on it and select “Show JavaScript Console.”<\/li>\n<\/ol>\n\n\n
          \n
          \"\"<\/figure>\n<\/div>\n\n\n
            \n
          1. The console will either open up within your existing Safari window, or in a new window. It will automatically select the Console tab.<\/li>\n<\/ol>\n\n\n
            \n
            \"\"<\/figure>\n<\/div>\n\n\n

            Mozilla Firefox<\/strong><\/h2>\n\n\n\n
              \n
            1. Open Firefox.<\/li>\n\n\n\n
            2. Click the three horizontal lines in the upper right corner (menu icon).<\/li>\n\n\n\n
            3. Select “Web Developer” and then “Web Console.” You can also use the keyboard shortcut Ctrl + Shift + K<\/code> or Cmd + Option + K<\/code> (on Mac).<\/li>\n<\/ol>\n\n\n
              \n
              \"\"<\/figure>\n<\/div>\n\n\n
                \n
              1. The Browser console will open in a new window.<\/li>\n<\/ol>\n\n\n
                \n
                \"\"<\/figure>\n<\/div>\n\n\n

                Microsoft Edge<\/strong><\/h2>\n\n\n\n
                  \n
                1. Open Edge.<\/li>\n\n\n\n
                2. Click the three horizontal dots in the upper right corner (menu icon).<\/li>\n\n\n\n
                3. Go to “More tools” and select “Developer tools.” You can also use the keyboard shortcut Ctrl + Shift + I<\/code> or Cmd + Option + I<\/code> (on Mac).<\/li>\n<\/ol>\n\n\n
                  \n
                  \"\"<\/figure>\n<\/div>\n\n\n
                    \n
                  1. The console will either open up within your existing Edge window, or in a new window. You may have to select the Console tab.<\/li>\n<\/ol>\n\n\n
                    \n
                    \"\"<\/figure>\n<\/div>\n\n\n
                    \n\n\n\n

                    Once you’ve opened the developer console, you can view error messages to help diagnose and troubleshoot issues with websites or plugins. Please copy them or simply take a screensht.<\/p>\n","protected":false},"excerpt":{"rendered":"

                    Occasionally, you might be asked to assist with identifying and fixing problems related to how a website or admin panel behaves. These problems might not immediately display errors, but they could be lurking in the background, causing the plugin to not work as expected. One useful tool that can help…<\/p>\n","protected":false},"author":1,"template":"","format":"standard","meta":{"footnotes":""},"ht-kb-category":[80],"ht-kb-tag":[],"class_list":["post-554","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-general"],"_links":{"self":[{"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/ht-kb\/554","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":4,"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/ht-kb\/554\/revisions"}],"predecessor-version":[{"id":578,"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/ht-kb\/554\/revisions\/578"}],"wp:attachment":[{"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/media?parent=554"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/ht-kb-category?post=554"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/help.kybernaut.cz\/en\/wp-json\/wp\/v2\/ht-kb-tag?post=554"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}