Создание html-кода ссылки

Бесплатный сервис по созданию html-кода ссылок.

Вводите адрес сайта и текст ссылки, а при желании - и дополнительные параметры, нажимаете кнопку "Создать код" - код вашей ссылки готов!

Скопировав его, вы легко сможете вставить html-код ссылки на ваш сайт или блог.

Исходный код этого примера:

<style>
    .row {
        display: flex;
        flex-wrap: wrap;
        margin-right: -15px;
        margin-left: -15px;
    }
    .col-sm-6 {
        position: relative;
        width: 100%;
        padding-right: 15px;
        padding-left: 15px;
    }
    @media (min-width: 810px) {
        .col-sm-6 {
            flex: 0 0 auto;
            width: 50%;
            max-width: 50%;
        }
    }
    textarea {
        width: 100%;;
    }
</style>
<script type="text/javascript">
    function cr(){
        var f=document.getElementById('frm');
        url=f.url.value;
        if(url==''||url=='http://'){alert("Укажите адрес сайта!");f.url.focus();return;}
        if(f.txt.value==''){alert("Укажите текст ссылки!");f.txt.focus();return;}
        if (url.indexOf(' ') >= 0||url.indexOf('.')<0) {alert("Укажите корректный URL!");f.url.focus();return false;}
//        if (url.slice(0,7)!='http://')url='http://'+url;
        f.url.value=url;
        str='<a href="'+url+'"';
        if(f.newwindow.checked)str+=' target="_blank"';
        if(f.nofollow.checked)str+=' rel="nofollow"';
        if(f.download.checked)str+=' download';
        if(f.title.value!='')str+=' title="'+f.title.value+'"';
        str+='>'+f.txt.value;
        if(f.pictogramm.checked)str+='<img src="strelka.gif" border="0" height="15" width="5">';
        str+='</a>';
        if(f.noindex.checked)str='<noindex>'+str+'</noindex>';
        document.getElementById('linkview').innerHTML=str;
        f.codebox.value=str;
    }
</script>

<form id="frm" onsubmit="cr();return false;">
    <div class="row">
        <div class="col-sm-6">
            <h2>Обязательные параметры</h2>
            <p>
                <label>
                    Адрес сайта<br>
                    <input name="url" type="text" size="30">
                </label>
            </p>
            <p>
                <label>
                    Текст ссылки<br>
                    <input name="txt" type="text" size="30">
                </label>
            </p>
        </div>
        <div class="col-sm-6">
            <h2>Дополнительные параметры</h2>
            <p>
                <label>
                    <input id="newwindow" name="newwindow" onclick="if(!this.checked) document.getElementById('pictogramm').checked=false;" type="checkbox"> Открывать в новом окне
                </label>
            </p>
            <p>
                <label>
                    <input id="pictogramm" name="pictogramm" onclick="if(this.checked) document.getElementById('newwindow').checked=true;" type="checkbox"></td><td colspan="3"> Добавить <a href="/download.php?url=/java/example/strelka.gif">пиктограмму</a> об открытии в новом окне
                </label>
            </p>
            <p>
                <label>
                    <input name="noindex" type="checkbox"> Окружить тегом &lt;noindex&gt;
                    <span class="hlp1" onclick="return !window.open('/analiz/meta-robots.php##noindex')" onmouseover="_tt.show(this,'Не индексировать ссылку для Яндекса')">?</span>
                </label>
            </p>
            <p>
                <label>
                    <input name="nofollow" type="checkbox"> Добавить атрибут rel="nofollow"
                    <span class="hlp1" onclick="return !window.open('/analiz/meta-robots.php#nofollow')" onmouseover="_tt.show(this,'Не передавать вес на сайт для Google')">?</span>
                </label>
            </p>
            <p>
                <label>
                    <input name="download" type="checkbox"> Добавить атрибут download
                    <span class="hlp1" onclick="return !window.open('/html/href.php#download')" onmouseover="_tt.show(this,'Застравляет браузер скачать файл, а не открыть его')">?</span>
                </label>
            </p>
            <p>
                <label>
                    Текст всплывающей подсказки:<br>
                    <input name="title" type="text" size="40">
                </label>
            </p>
        </div>
    </div>
    <p style="text-align: center;"><input value='Создать ссылку' type="submit"></p>

    <div class="row">
        <div class="col-sm-6">
            <p>Ваша ссылка будет выглядеть так:</p>
            <div style="text-align:center; min-height: 37px;font-size:130%;border: 1px solid gray; padding: 5px;">
                <span id="linkview">
                </span>
            </div>
        </div>
        <div class="col-sm-6">
            <h2>Код вашей ссылки:</h2>
            <textarea id="codebox" rows="6" onfocus="this.select()"></textarea>
        </div>
    </div>
</form>

Идею взял у http://useit.com.ua/. Мой код полностью реализован на JavaScript, без использования PHP и без перезагрузки страницы. При копировании обязательно сохранять активную ссылку на htmlweb.ru.

Вам также может пригодиться:
Генератор ссылок.