Jump to content

Thomas Diroll

Members
  • Posts

    3
  • Joined

  • Last visited

Posts posted by Thomas Diroll

  1. Thanks for all your answers!!! This was really fast and seems like a very active community! I'm sure the code snippet by @szabesz and the fieldtype by @kixe will work as well and are definitely more lightweight. I went with the RuntimeMarkup fieldtype suggested by @elabx as it was the fastest and easiest one to apply. Here is my php snippet for the runtime field:

    return "
    <a id='custom-action-button' href='#' onclick='copyUrlToClipboard(event);'>Copy URL to clipboard</a>
    <input type='text' value='" . $page->httpUrl() . "' id='target-page-url'>
    <p id='action-executed-hint'>Successfully copied URL to clipboard!</p>
    
    <style>
    #custom-action-button {
    color: #FFF;
    background: #93BF0D;
    font-weight: bold;
    padding: 0.6em 1.1em;
    font-size: 1em !important;
    border-radius: 5px;
    }
    #custom-action-button:hover {
    color: #FFF;
    background-color: #DB1174;
    }
    #custom-action-button:active {
    color: #FFF;
    background-color: #860A47;
    }
    #custom-action-button:visited {
    color: #FFF;
    }
    #target-page-url {
    position: absolute;
    left: -9999px;
    top: -9999px;
    opacity: 0;
    pointer-events: none;
    }
    #action-executed-hint {
    display: none;
    }
    #action-executed-hint.show {
    display: inline;
    }
    </style>
    
    <script>
    function copyUrlToClipboard(event) {
    event.preventDefault();
    var urlText = document.getElementById('target-page-url');
    urlText.select();
    document.execCommand('copy');
    var hint = document.getElementById('action-executed-hint');
    hint.className += ' show';
    }
    </script>
    ";

    It creates an a-tag which is styled like a backend button. Hope its useful for someone else!

    • Like 7
  2. Hi guys I'm relatively new to PW and just finished developing a page for a client. I was able to include all necessary functionality using the core fieldtypes but now I it seems that I need to extend them with a custom one. What I need is a simple button, that copies the absolute url (frontend not PW-backend) of the page which is currently edited to the clipboard. As this feature is only needed inside a specific template, I tend to use a custom fieldtype which provides this feature. I've been looking inside the core modules code (eg. FieldtypeCheckbox.module) but I don't really get the structure of it and how its rendered to the admin page. I also didn't find a lot of tutorials covering custom fieldtypes.

    Maybe some of you could give me some tips on how to write a basic custom fieldtype that renders a button which copies the value of

    page->httpUrl()

    to the clipboard using JS. Thanks!

×
×
  • Create New...