HTMLEscaper v1.0.2
Это простое расширение, которое предоставляет web-safe версию текущего HTML документа. Для многих HTMLEscaper пригодится использовать его для записей в блогах.
Использование данного расширения очень простое. Что необходимо сделать для преобразования и получения кода, который можно всавить в статье, это перейти во вкладку Вид > Show HTMLEscaper. У вас появится окно, которое можно растягивать, и в нем уже будет новый преобразованный HTML код.
Было так:
Получим:
Использование данного расширения очень простое. Что необходимо сделать для преобразования и получения кода, который можно всавить в статье, это перейти во вкладку Вид > Show HTMLEscaper. У вас появится окно, которое можно растягивать, и в нем уже будет новый преобразованный HTML код.
Было так:
Код
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Starter Template for Bootstrap 3.2.0</title>
<link rel="shortcut icon" href="">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<style>body{padding-top:50px;}.starter-template{padding:40px 15px;text-align:center;}</style>
<!--[if IE]>
<script src="https://cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!--.nav-collapse -->
</div>
</nav>
<div class="container">
<div class="starter-template">
<h1>Hello, world!</h1>
<p class="lead">Now you can start your own project with <a target="_blank" href="http://getbootstrap.com/">Bootstrap 3.2.0</a>. This plugin is a fork from <a href="https://github.com/le717/brackets-html-skeleton#readme">HTML Skeleton</a>.</p>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
<html lang="">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Starter Template for Bootstrap 3.2.0</title>
<link rel="shortcut icon" href="">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<style>body{padding-top:50px;}.starter-template{padding:40px 15px;text-align:center;}</style>
<!--[if IE]>
<script src="https://cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!--.nav-collapse -->
</div>
</nav>
<div class="container">
<div class="starter-template">
<h1>Hello, world!</h1>
<p class="lead">Now you can start your own project with <a target="_blank" href="http://getbootstrap.com/">Bootstrap 3.2.0</a>. This plugin is a fork from <a href="https://github.com/le717/brackets-html-skeleton#readme">HTML Skeleton</a>.</p>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
Получим:
Код
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Starter Template for Bootstrap 3.2.0</title>
<link rel="shortcut icon" href="">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<style>body{padding-top:50px;}.starter-template{padding:40px 15px;text-align:center;}</style>
<!--[if IE]>
<script src="https://cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!--.nav-collapse -->
</div>
</nav>
<div class="container">
<div class="starter-template">
<h1>Hello, world!</h1>
<p class="lead">Now you can start your own project with <a target="_blank" href="http://getbootstrap.com/">Bootstrap 3.2.0</a>. This plugin is a fork from <a href="https://github.com/le717/brackets-html-skeleton#readme">HTML Skeleton</a>.</p>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
<html lang="">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Starter Template for Bootstrap 3.2.0</title>
<link rel="shortcut icon" href="">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<style>body{padding-top:50px;}.starter-template{padding:40px 15px;text-align:center;}</style>
<!--[if IE]>
<script src="https://cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://cdn.jsdelivr.net/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!--.nav-collapse -->
</div>
</nav>
<div class="container">
<div class="starter-template">
<h1>Hello, world!</h1>
<p class="lead">Now you can start your own project with <a target="_blank" href="http://getbootstrap.com/">Bootstrap 3.2.0</a>. This plugin is a fork from <a href="https://github.com/le717/brackets-html-skeleton#readme">HTML Skeleton</a>.</p>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
Рекомендации
Рекомендуем после установки расширения, проверить его на обновление более новой версии при помощи МЕНЕДЖЕР РАСШИРЕНИЙ. Если расширение не имеет более нового обновления, значит вы используете последнюю версию.
Установка
Способ 1:
1. Скачать архив расширения
2. Запустить редактор Brackets
3. Распаковать скачанный архив в папку /user/. Как найти папку /user/ ?
В редакторе Brackets выбираем вкладку ПОМОЩЬ > ПОКАЗАТЬ ДИРЕКТОРИЮ РАСШИРЕНИЙ
4. Распаковываем.
5. После распаковки у вас появится новая папка с названием расширения в директории /user/.
6. Перезапускаем редактор Brackets
7. Радуемся установленному расширению.
2. Запустить редактор Brackets
3. Распаковать скачанный архив в папку /user/. Как найти папку /user/ ?
В редакторе Brackets выбираем вкладку ПОМОЩЬ > ПОКАЗАТЬ ДИРЕКТОРИЮ РАСШИРЕНИЙ
4. Распаковываем.
5. После распаковки у вас появится новая папка с названием расширения в директории /user/.
6. Перезапускаем редактор Brackets
7. Радуемся установленному расширению.
Способ 2:
1. Запустить редактор Brackets
2. Переходим во вкладку ФАЙЛ > МЕНЕДЖЕР РАСШИРЕНИЙ
3. В появившемся окне, в поле ПОИСК вводим - HTMLEscaper
4. Нажимаем УСТАНОВИТЬ.
5. Начнется загрузка и установка расширения.
6. По завершению установки, редактор Brackets перезапустится.
Если этого не произошло - перезагружаем вручную.
7. Радуемся установленному расширению.
2. Переходим во вкладку ФАЙЛ > МЕНЕДЖЕР РАСШИРЕНИЙ
3. В появившемся окне, в поле ПОИСК вводим - HTMLEscaper
4. Нажимаем УСТАНОВИТЬ.
5. Начнется загрузка и установка расширения.
6. По завершению установки, редактор Brackets перезапустится.
Если этого не произошло - перезагружаем вручную.
7. Радуемся установленному расширению.
