I am a web developer and using Atom as text editor but I always have to change some autocomplete suggestions.
For example when I type html and pres tab it gives me this
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
This result is not actually what so I manually change it like this
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=11">
<meta name="author" content="Your name">
<meta name="description" content="Brief description">
<link rel="manifest" href="/manifest.json">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<meta name="theme-color" content="#00FFF0">
<link href="style.css" rel="stylesheet">
<title>Title</title>
</head>
<body>
<script src="script.js"></script>
</body>
</html>
So I did a research and everybody solves this kind of similar issues with snippets I am not asking how can I do it with snippet. I already know it. I want to change these codes from editor's current location. Possibly it locates somewhere in ~/AppData/Local/atom but I haven't found it yet. I want to reach that file and change related suggestions from there.
This is not only for html suggestion I also want to remove something from PHP suggestion and add some for JavaScript suggestion.
Any idea how this system works and how to do it ?
Thanks.
Related
I want to use EditorJS in my project. So I have created an HTML file after reading the documentation. Here is the file called index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home</title>
</head>
<body>
<div id="editorjs"></div>
<script src="https://cdn.jsdelivr.net/npm/#editorjs/editorjs#latest"></script>
<script>
import EditorJS from '#editorjs/editorjs'
const editor = new EditorJS('editorjs')
</script>
</body>
</html>
After opening the file into the browser, EditorJS is not showing up and this message is printed in the console- Uncaught SyntaxError: Cannot use import statement outside a module.
How to fix this problem?
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdn.jsdelivr.net/npm/#editorjs/editorjs#latest"></script>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home</title>
</head>
<body>
<div id="editorjs"></div>
<script>
const editor = new EditorJS({
autofocus: true
});
</script>
</body>
</html>
When you add a script tag in your HTML file, you don't need to import the library again you can just start using it!
The script isn't a type module, use:
<script type="module">
I changed the title of my index.html page in my Angular app. Since it is not a component is it possible to test it, and if so, how?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Animations Workshop</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
What I am trying to do is when the user creates some post(social media post) it has a unique id in backend
example 1123 and one more post with unique id of 1134 there is only one html page How and to access them the urls are like this
mysite.com/post/1123------>post.html
mysite.com/post/1134------>post.html
how do I map these two urls to same page using javascript.
And I dont want to pass the unique ids in parameters because these are the links to specific post that all users can see
Can anybody help me on this
It should be like this
First Post with ID 1123
URL mysite.com/post/1123
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>hello id 1123</h1>
</body>
</html>
and the next post(social media post) with id 1134
URL mysite.com/post/1134
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>hello id 1134</h1>
</body>
</html>
And these two URL's are pointing to same html
[link for the css]:https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/style.css
[link for javascript code file]:https://github.com/mdn/learningarea/blob/master/html/introduction-to-html/the-html-head/script.js
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Meta examples</title>
<meta name="author" content="Chris Mills">
<meta name="description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:image" content="https://developer.cdn.mozilla.net/static/img/opengraph-logo.dc4e08e2f6af.png">
<meta property="og:description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:title" content="Metadata; The HTML <head>, on MDN">
<link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Meta examples</h1>
<p>Japanese example: ご飯が熱い。</p>
<script src="script.js"></script>
</body>
</html>
When I was trying to run the above HTML code, the output just shows this
Meta examples
japanese example:???
I was trying to learn to become a front-end developer, so I just started with HTML where I got struck in this. Please anyone help me with this.
The above HTML document does not consider the CSS and Javasricpt file even though it is presented in the same directory. I also tried it with different browsers.
Please provide correct path in the src attribute of your link tag and it should work.
Check:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Meta examples</title>
<meta name="author" content="Chris Mills">
<meta name="description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:image" content="https://developer.cdn.mozilla.net/static/img/opengraph-logo.dc4e08e2f6af.png">
<meta property="og:description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:title" content="Metadata; The HTML <head>, on MDN">
<link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/style.css">
</head>
<body>
<h1>Meta examples</h1>
<p>Japanese example: ご飯が熱い。</p>
<script src="https://github.com/mdn/learningarea/blob/master/html/introduction-to-html/the-html-head/script.js"></script>
</body>
</html>
I'm using angular and angular-route. The index.html looks like this:
<!DOCTYPE html>
<html lang="en" ng-app="Showcase">
<head>
<meta charset="UTF-8">
<title>UCSD Showcase</title>
<base href="/showcase/">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.min.js"></script>
<script src="routes.js"></script>
<script src="./js/bootstrap.min.js"></script>
<script src="js/initGlobalHelpers.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="#########################################">
<meta name="keywords" content="###############################################">
<meta property="og:url" content="#">
<meta property="og:site_name" content="CSES OSS">
<meta property="og:image" content="############################################################################################">
<meta property="og:description" content="#">
<meta property="og:type" content="website">
<meta name="twitter:site_name" content="CSS OSS">
<meta name="twitter:site" content="################">
<meta name="twitter:card" content="summary">
<meta name="twitter:description" content="#">
<meta name="twitter:image" content="#">
<meta name="image" content="#">
<link rel="stylesheet" media="all" href="./styles/style.css">
</head>
<body>
<ng-view></ng-view>
</body>
</html>
And then for my home page when I'm using
<h1>This is the home page</h1>
<script src="home.html"></script>
I get the a warning
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. jquery.min.js:4
and an error
SyntaxError: Unexpected token < angular.js:13550
However when I replace that script that by the content of the script which basically ends up looking like:
<h1>This is the home page</h1>
<script>
console.log('Hi!');
</script>
Then it works.
Why is this happening and how can I fix it?
Use ngInclude instead of html script tag
<div ng-include="'home.html'"></div>
See ngInclude docs here