Кнопка скопировать логин в профиле

[Isaac1337]

Хай, привет, здарова.

Сегодня мы добавим кнопку "скопировать логин" для телеграмм или иного мессенджера.

В доп поля вставляем данный html код. Вы можете все переделать под себя.

<a style="color: #2577b1;" href="tg://resolve?domain={$value}">Открыть чат в Telegram</a>
<p class="telegram-field" id="telegram-field">{$value}</p>
<button data-toggle="tooltip" id="copytgtooltip" class="telegram-copyBtn"><i class="far fa-clone" aria-hidden="true"></i></button>
<style>
    .telegram-field {
        display: none;
    }
    .telegram-copyBtn:hover {
        color: #a8a8a8;
    }
    .telegram-copyBtn {
        font-size: 15px !important;
        border: none;
        color: #888585;
        background: #0000;
        cursor: pointer;
    }
</style>

$(function() {
    // copy content to clipboard
    function copyToClipboard(element) {
        var $temp = $("<input>");
        $("body").append($temp);
        $temp.val($(element).text()).select();
        document.execCommand("copy");
        $temp.remove();
    }

    // copy telegram to clipboard

    $(".telegram-copyBtn").on("click", function() {
        copyToClipboard("#telegram-field");
        XF.flashMessage('Логин скопирован в буфер обмена', 3000);
    });
});
<script>
    tippy('#copytgtooltip', {
    content: "Скопировать логин",
    theme: 'custom',
    placement: 'top',
    arrow: true,
    animation: 'fade',
});

В доп поля юзера

<a href="https://t.me/{$value}"target="_blank">Открыть чат в Telegram</a>
<a data-xf-init="copy-to-clipboard" data-copy-text="{$value}"> <i class="far fa-clone" aria-hidden="true"></i></a>
<a data-xf-init="copy-to-clipboard"> <span data-xf-init="tooltip" data-original-title="Скопировать" aria-label="Скопировать" id="js-XFUniqueId101"> </span> </a>

Результат

 

[West14]

data-xf-init="copy-to-clipboard" data-copy-target=".js-copyTarget" data-success="Текст скопирован в буфер обмена."

tippy

с чего взяли, что у всех эта библиотека подключена?

style

за инлайн стили и стили в тегах style положено ломать руки, суём в экстру и учимся писать без импортантов

72 часа на исправление, не нужно захламлять людям форумы

 

[shmecik]

Идея не плохая, хотелось бы доработки кода