Skip to content

Instantly share code, notes, and snippets.

@beardedtim
Created February 29, 2016 17:59
Show Gist options
  • Save beardedtim/53c644107199d4a76b7d to your computer and use it in GitHub Desktop.
Save beardedtim/53c644107199d4a76b7d to your computer and use it in GitHub Desktop.
<div class="text-box">
<?php
$textGroup = $page['text_group'];
// prettyEcho($text);
foreach($textGroup as $text){
if($text['heading']){ ?>
<h4><?php echo $text['heading']; ?></h4>
<?php
} if($text['paragraphs']) {
echo $text['paragraphs'];
}
}
?>
</div>
<script>
jQuery(document).ready(function($){
// first we set our vars
// we are using regex to find
// any text that looks like this:
// { some string of text here }
var linkFind = /{(.*)}/;
// we are grabbing all of the p
// tags within our box
var paragraphs = $('.text-box p');
$(paragraphs).each(function(){
// we grab just the text from inside
// of the p tags so our regex
// doesn't mess anything up
var text = $(this).text();
// then we make an array for all
// of the text that matches our
// regex search
var linkText = text.match(linkFind);
// if we find it
if(linkText){
// first we split the text into
// an array, at the | character
// since our match looks like:
// { Text | link }
var text = linkText[1].split('|');
// We want whatever the first half of
// the found regex is to be our found var
//
// looking at this, we are setting alot
// of vars to the same thing. We should
// refactor this for theme usage.
var found = $(this).text().match(linkFind)[0];
// then we clean the string...
// alot
text[1] = text[1].trim();
text[1] = text[1].replace('/', '');
text[1] = text[1].replace("'", '');
text[1] = text[1].replace("'", '');
// then we tell jQuery to:
// look at this (the p tag we are dealing
// with inside of the loop), grab the html,
// and replace that html with whatever you
// get when you get the html of this (p tag),
// replace the string found with this string
// that I am getting you. If you don't do it
// this way, the HTML doesn't get converted to
// html and just shows up as '<a href="...">'
// on the page.
$(this).html($(this).html().replace(found,'<a href="' + text[1] + '">' + text[0] + '</a>'));
}
});
// var check = $('.text-box p').match(link);
// console.log(paragraphs);
});
</script>
@beardedtim
Copy link
Author

This allows you, inside of ACF, to enter any text you want as a link as { Link Text | /link/to/text } and have the jQuery function replace it with Link Text

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment