Wordpressのコピペボタンを実装して、オリジナルのテキスト通りにペーストできるようにしたい。

実現したいこと

別サイトに記載されているテキストの内容を「TabsRespondive」(WPのプラグイン)を利用して一つのページにまとめ、それぞれ「Copy Anything to Clipboard」を使用してコピーボタン1つで別サイトに記載されている通り(空白の行も)にコピペできるようにしたい。
イメージ説明

前提

Wordpressで作成した情報ポータルサイトの刷新作業中でして、UI/UXの向上。

発生している問題・エラーメッセージ

元々のサイトのテキストの空白の行が実現したい方法でコピペすると表示されない。

試したこと

Tabs Responsive内のテキストが<pre>タグ内にあるので、CSSにて

pre{ white-space: pre-wrap; }
pre{ white-space: pre-line; }
pre{ white-space: break-spaces; }

等を試しました。
実現できれば別の方法でも大丈夫ですのでご教示いただけますと幸いです。
初心者でして、至らぬ点が多々あるかと思いますがお力添えいただけますと幸いです。
よろしくお願いいたします。

補足情報(FW/ツールのバージョンなど)

Wordpress6.2.2
Twenty Twentyバージョン: 2.2
Tabs Responsiveバージョン2.3.9
Copy Anything to Clipboardバージョン2.6.3

コピペボタンが実装できれば特にこのプラグインを使用しないといけないなどの縛りはありません。

コメントを投稿

0 コメント