when I type doc + tabe it automatically generate a baisc html structure:
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
How can I change this? I search through
C:\Users\[user]\AppData\Roaming\Sublime Text 2\Packages\HTML
But couldn't find the trigger keyword 'doc'
Have a look in the Emmet package.
Preferences -> Browse Packages and locate Emmet.
Look in the snippets.json file.
But the advice of sergioFC is wise. Make your own snippet instead of trying to alter the default behaviour of Emmet
Related
I would like to Pre-format when I create a new HTML document so I can get some already link and meta tag on it . By default I have this pre format below but i would like to add more and take out some of the tag. Would you recommand me how to make it ?
<!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>
</body>
</html>
To improve the formatting of your HTML source code, you can use the Format Document command Ctrl+Shift+I to format the entire file or Format Selection Ctrl+K Ctrl+F to just format the selected text.
https://code.visualstudio.com/docs/languages/html
I am making a website and my client wants what he refers to as a "Eraser file" to be on the top section of the site. Here is a example website that uses this feature http://flashpoint.gatech.edu/
How can I use this file and implement it in html? I have searched for eraser and zap file answers, but could not find anything on them.
This is very easy because it is actually a jQuery plugin...
(I did not find any viable CDN for that library, so I cannot give you the live example in a JSFiddle. Please download this in a file called "eraser.js" and put it in the same directory as this HTML file. You should be able to erase the Stack Overflow logo.)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Eraser</title>
</head>
<body>
<img src="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon#2.png?v=73d79a89bded">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="eraser.js"></script>
<script>$('img').eraser();</script>
</body>
</html>
In Sublime Text 3, when I create a new file (HTML, JavaScript, PHP, etc), is there a way to edit the default tags and their indentations? Currently, when I create a new file, say HTML, I get:
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
I would like to change it so that a new HTML file creates:
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Is this possible without plugins or will I have to search for/make one?
You can change the default snippet with the PackageResourceViewer plugin.
Install PackageResourceViewer through Package Control
Press Ctrl+Shift+P and type prv
Select PackageResourceViewer: Open Resource
Type html and select it.
Select html.sublime-snippet
I am using Sublime Text 2 to write my testing html file. I save the text as HTML format.
Then when I try to open the file with browser by either drag&drop or Open_With...
Then.....
The browser open my plain text file, not the actual html.
This is what it look like. Just white background and these text.
<!DOCTYPE html>
<head>
<title>A Hello World Page</title>
</head>
<body>
<p>Hello World</p>
</body>
This is my first time with html ever, do I have to do special setup with anything? I just use default SublimeText2.
That may be because you are missing the main tag <html>.
Do this:
<!DOCTYPE html>
<html>
<head>
<title>A Hello World Page</title>
</head>
<body>
<p>Hello World</p>
</body>
</html>
<html> is the main tag, browser will look for to tell whether it is html or not.
Also make sure it is saved as .html or .htm
Open up Sublime Text, press CTRL SHIFT + P.
Type in HTML into the box and select Set syntax: HTML.
Then, in the file, type in html then press tab straight after and it should create a snippet (which is default):
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Then make sure you save the document as .html or .htm.
This should work in your browser after.
Note: Setting syntax and doing snippet wont actually 'help' in terms of this question, but will help you in HTML by making things quicker and having syntax highlighting.
For some strange reason, I cannot edit or apply styles to html in Sublime Text 2. I cannot do internal styles or link to external styles. However, if I take code that I have done into Dreamweaver or Notepad++, the styles are applied and editable? How can I get sublime Text 2 to allow me apply and edit styles?
I have Windows 7 and I'm new to HTML and CSS. I'm trying to learn different code editors, but it's quite difficult when the editors won't work :(
Thanks!
ETA: When I mean styles I mean css. I can't view any css styling on my html page on Sublime text 2. Only when I use notepad++ or dreamweaver. I can't see css in a browser when I use sublime text 2.
Here's my code:
<!DOCTYPE html>
<head>
<meta charset=utf-8" />
<title>Untitled Document</title>
</head>
<style>
body{
background: orange;
}
</style>
<body>
</body>
</html>
You're issue isn't with the editor; it's likely that there are some errors in the document.
You're currently missing the opening <html>, <style> elements should be inside either the <head> or <body> rather than between them, and the charset attribute should have a 2nd quotation to surround the value:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Untitled Document</title>
<style>
body{
background: orange;
}
</style>
</head>
<body>
</body>
</html>
The issue is not the text editor, it must be your code. You may be opening an outdated file and looking for the changes in there. Make sure that you are saving the file in the correct location and opening the correct file when looking for changes.
Also, make sure that you are saving it as .html, Sublime Text 2 will not automatically give your files an extension like Dreamweaver or other editors might.