Attention:

Support Rules and Guidelines
Before you post your support topic, please remember to:
  • Read the support forum rules.
  • Check the wiki and use search to see if your problem can be answered there first.
  • Link your board please, and make sure that the problem on your board is visible to guests or provide a test account.
  • Do not post Board Wrappers and CSS unless requested. With a board link, this is not necessary.
  • Be as descriptive as you can and use as many details as possible when describing your problem.
  • Please briefly mark any links to forums that may not be work-safe.
This will help ensure your support issue will be attended to in a quick and efficient manner.

  Add ReplyNew TopicNew Poll

 how to allow html / css / bbcode in a custom profile field?
#
Just curious because here's my profile so far
this is the field which i want to allow html, css and bbcode!

<!-- |field_5| -->

https://birding.jcink.net/index.php?showuser=1

please help me out with this

thank you!

signature
#
Admin CP → System Settings → User Profiles → Allow HTML in Custom Profile Fields?

Doesn't look like there's an option for BBCode, but you can make BBCode work in custom profile fields with JavaScript.

signature
user posted image
#
QUOTE (Cory @ Jul 11 2018, 01:32 PM)
Doesn't look like there's an option for BBCode, but you can make BBCode work in custom profile fields with JavaScript.


Word?

signature
Kindly do not contact me on Discord or PM me for support.

user posted image
#
QUOTE (owl @ Jul 11 2018, 08:04 PM)
QUOTE (Cory @ Jul 11 2018, 01:32 PM)
Doesn't look like there's an option for BBCode, but you can make BBCode work in custom profile fields with JavaScript.


Word?


I wouldn't mind if you made that code, Cory.
PM
#
QUOTE (Cory @ Jul 11 2018, 01:32 PM)
Admin  CP → System Settings → User Profiles → Allow HTML in Custom Profile Fields?

Doesn't look like there's an option for BBCode.

Just confirming that this observation is correct. There is no option to allow BBCode, only HTML.

signature
email: admin@jcink.com :: blog: John C.
#
What BBCode's would y'all like to use in custom profile fields?

signature
user posted image
#
QUOTE (Cory @ Jul 12 2018, 05:39 AM)
What BBCode's would y'all like to use in custom profile fields?


For me, I'd say just the basics. Color, bold, italics, underline.
PM
#
Before creating the code, I'll allow up to 24 hours for more feedback.

signature
user posted image
#
CODE
Bold, italics, and underlined text - in that order. If possible, the [LIST]to <ul> (edit, and [/list] to </ul>) and [*] to <li> would be super helpful and amazing. Are you looking to post this code on your site? I need to go back through and finish my registration.


This post has been edited by owl: Jul 12 2018, 01:04 PM

signature
Kindly do not contact me on Discord or PM me for support.

user posted image
#
I'll release the code on my board and post it here.

signature
user posted image
#
Styles: Bold, Underline, Italic, Color

CODE
<script>
//<![CDATA[
$('#profile-customfields div.row2:contains([/), span.postdetails:contains([/)').each(function() {
   $(this).html($(this).html().replace(/\[b\](.+?)\[\/b\]/ig, '<strong>$1</strong>').replace(/\[u\](.+?)\[\/u\]/ig, '<span style="text-decoration: underline">$1</span>').replace(/\[i\](.+?)\[\/i\]/ig, '<em>$1</em>').replace(/\[color=(.+?)\](.+?)\[\/color\]/ig, '<span style="color: $1">$2</span>'));
});
//]]>
</script>

Lists: Will only work in the main profile when using a textarea field.

CODE
<script>
//<![CDATA[
$('#profile-customfields div.row2:contains([/)').each(function() {
   $(this).html($(this).html().replace(/\[list\]<br>/ig, '<ul>').replace(/\[\/list\]/ig, '</ul>').replace(/\[\*\](.+?)<br>/ig, '<li>$1</li>'));
});
//]]>
</script>

Hyperlinks:

CODE
<script>
//<![CDATA[
$('#profile-customfields div.row2:contains([/), span.postdetails:contains([/)').each(function() {
   $(this).html($(this).html().replace(/\[url=(.+?)\](.+?)\[\/url\]/ig, '<a href="$1" target="_blank">$2</a>'));
});
//]]>
</script>

Images:

CODE
<script>
//<![CDATA[
$('#profile-customfields div.row2:contains([/), span.postdetails:contains([/)').each(function() {
   $(this).html($(this).html().replace(/\[img\](.+?)\[\/img\]/ig, '<img src="$1" alt="" />'));
});
//]]>
</script>

signature
user posted image
#
Nice stuff Cory. If you're interested, you can also iterate over a set of provided tags to translate them without the need for a function per tag.

Although, genuine curiousity: RegExp can be pretty slow. I think it would be more performance-oriented to write a script that would translate these tags to html in the User CP itself, and then have another script on the front-facing site that would iterate over each relevant profile field and re-insert its text as HTML - a la $(this).html($(this).text()) - to save the 'heavy lifting' for the backend.

This post has been edited by Dusty: Jul 13 2018, 12:23 PM
PM
#
Redacted to relevant support forum.

This post has been edited by owl: Yesterday at 03:10 pm

signature
Kindly do not contact me on Discord or PM me for support.

user posted image
#
Dusty: The only reason I split them into different functions is to give users a choice of what BBCode's they want to enable in custom profile fields. I doubt everyone wants to use the same ones.

I like your idea, but it almost seems like using HTML in custom profile fields in the first place. If a user sees HTML tags after they edit their profile that contained BBCode tags, that could cause some confusion and make people think there's a bug. Plus, a lot of people don't know a thing about HTML, so they won't know what HTML tags do what.

signature
user posted image
2 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
Share this topic:
« Next Oldest | General Support | Next Newest »

Options Add ReplyNew TopicNew Poll