PrivateCoffee/wp-duckbehaviorjournal
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: add DOI copy-to-clipboard functionality

Browse source 
Introduced a new JavaScript file to handle the DOI copy-to-clipboard feature. Updated the 'single-article.php' template to include a clickable DOI link that copies the DOI to the clipboard and displays a confirmation message. Enhances user convenience by simplifying the process of copying DOIs.
This commit is contained in:
Kumi 2024-06-20 15:24:22 +02:00
parent ac0a7eb942
commit 3bd51e66ed
Signed by: kumi
GPG key ID: ECBCC9082395383F
2 changed files with 38 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
assets/js/clipboard.js Normal file
View file

@ -0,0 +1,22 @@
document.addEventListener("DOMContentLoaded", function () {
const doiLink = document.getElementById("doi-link");
const doiCopyMessage = document.getElementById("doi-copy-message");
doiLink.addEventListener("click", function (event) {
event.preventDefault();
const doi = doiLink.getAttribute("data-doi");
const fullDoiUrl = `${window.location.origin}/${doi}`;
navigator.clipboard.writeText(fullDoiUrl).then(
function () {
doiCopyMessage.style.display = "inline";
setTimeout(function () {
doiCopyMessage.style.display = "none";
}, 2000);
},
function () {
alert("Failed to copy DOI to clipboard.");
}
);
});
});

26
single-article.php
View file

@ -16,19 +16,23 @@
}
?>
<p class="text-muted">
<strong>DOI:</strong> <?php echo esc_html(get_post_meta(get_the_ID(), 'article_doi', true)); ?>
<strong>DOI:</strong>
<a href="#" id="doi-link" data-doi="<?php echo esc_attr(get_post_meta(get_the_ID(), 'article_doi', true)); ?>">
<?php echo esc_html(get_post_meta(get_the_ID(), 'article_doi', true)); ?>
</a>
<span id="doi-copy-message" style="display: none; color: green; margin-left: 10px;"><?php _e('Copied!', 'duck-behavior-journal'); ?></span>
</p>
<p class="text-muted">
<strong>Status:</strong> <?php
$terms = get_the_terms(get_the_ID(), 'publication_status');
if (!empty($terms) && !is_wp_error($terms)) {
$term_list = array();
foreach ($terms as $term) {
$term_list[] = $term->name;
}
echo implode(', ', $term_list);
}
?>
$terms = get_the_terms(get_the_ID(), 'publication_status');
if (!empty($terms) && !is_wp_error($terms)) {
$term_list = array();
foreach ($terms as $term) {
$term_list[] = $term->name;
}
echo implode(', ', $term_list);
}
?>
</p>
<?php if (false && has_post_thumbnail()) : ?>
<img src="<?php the_post_thumbnail_url(); ?>" class="img-fluid mb-4" alt="<?php the_title(); ?>">
@ -40,4 +44,6 @@
</div>
</section>
<script src="<?php echo get_template_directory_uri(); ?>/assets/js/clipboard.js"></script>
<?php get_footer(); ?>