Styling the Contact Information

For support and discussion related to templates, themes, and imagesets in phpBB 3.2.
Post Reply
Con Foozed
Registered User
Posts: 6
Joined: Sun Dec 17, 2017 1:30 pm

Styling the Contact Information

Post by Con Foozed » Sun Dec 17, 2017 2:00 pm

On the page that shows when clicking 'Contact Us', above the form submit is a content box which can be edited from 'Contact Page Settings' within the ACP. But that box only permits BB code, which is painfully inadequate for the task. I want to style the content of that box with a bit of custom css, with a horizontally split section of text, two or maybe three columns, which is clearly beyond the scope of bbcode. I have no problem in creating the style, I'm just having problems working out how to embed it for this particular instance! Is there any way of permitting html/css within that field?

User avatar
Christian 2.0
Former Team Member
Posts: 4440
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Styling the Contact Information

Post by Christian 2.0 » Sun Dec 17, 2017 4:39 pm

Hello :)

The template file for this page is memberlist_email.html, and the code for that particular section is:

Code: Select all

<div class="panel">
		<div class="inner">
			<div class="postbody">
				<div class="content">
					{CONTACT_INFO}
				</div>
			</div>
		</div>
	</div>
{CONTACT_INFO} outputs whatever you enter into the ACP :)
🚀 Premium phpBB Styles
Premium 3.2 Styles: Modern phpBB Style, Gaming phpBB Style
Premium 3.2 Extensions: phpBB sidebar Extension
Custom work available on request

Con Foozed
Registered User
Posts: 6
Joined: Sun Dec 17, 2017 1:30 pm

Re: Styling the Contact Information

Post by Con Foozed » Sun Dec 17, 2017 7:06 pm

It's a little crude still, as I'll have to style the *whole* content of {CONTACT_INFO} as a single selector - in other words, no chance of my columns, etc., because any classes that I enter into the ACP panel will simply render as text :(. That's why I was hoping to find a way of entering html directly into the ACP window. Many thanks though - a single selector is better than nothing!

User avatar
Christian 2.0
Former Team Member
Posts: 4440
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Styling the Contact Information

Post by Christian 2.0 » Sun Dec 17, 2017 7:33 pm

Would you be able to share a mockup of what you're trying to achieve?
🚀 Premium phpBB Styles
Premium 3.2 Styles: Modern phpBB Style, Gaming phpBB Style
Premium 3.2 Extensions: phpBB sidebar Extension
Custom work available on request

Con Foozed
Registered User
Posts: 6
Joined: Sun Dec 17, 2017 1:30 pm

Re: Styling the Contact Information

Post by Con Foozed » Sun Dec 17, 2017 9:04 pm

https://ibb.co/j43K76Image
is sort of what I'm after, although there would be text over each image too. I think bbcode might be a bit overwhelmed ;)

User avatar
eeji
Jr. Style Validator
Posts: 686
Joined: Fri Dec 12, 2008 9:08 pm
Location: Manchester, UK

Re: Styling the Contact Information

Post by eeji » Sun Dec 17, 2017 9:05 pm

It may be a bit hacky, but you could define your own bbcodes to use the HTML/CSS required for your layout. Using this method would also survive any future updates without having to re-implement as theres no changes made to the core code.

Con Foozed
Registered User
Posts: 6
Joined: Sun Dec 17, 2017 1:30 pm

Re: Styling the Contact Information

Post by Con Foozed » Sun Dec 17, 2017 9:14 pm

I didn't know writing your own bbcodes was even possible!

User avatar
Christian 2.0
Former Team Member
Posts: 4440
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Styling the Contact Information

Post by Christian 2.0 » Mon Dec 18, 2017 1:19 am

Eeji is correct!

The most elegant way to achieve this would be with a custom BBCode, defined in: ACP -> Posting -> BBcodes -> Add new BBCode

BBCode usage:

Code: Select all

[customContact][/customContact]
HTML Replacement:

Code: Select all

*your 3 x image code*
There's no need to use the content variables such as {TEXT} in your BBCode as the content is coming from the HTML replacement.

Then just insert the images into the contact page by inserting [customContact][/customContact] into the contact page message :)
🚀 Premium phpBB Styles
Premium 3.2 Styles: Modern phpBB Style, Gaming phpBB Style
Premium 3.2 Extensions: phpBB sidebar Extension
Custom work available on request

Con Foozed
Registered User
Posts: 6
Joined: Sun Dec 17, 2017 1:30 pm

Re: Styling the Contact Information

Post by Con Foozed » Mon Dec 18, 2017 11:00 am

I'm clearly doing something fundamentally wrong, because this isn't working :( .
I've gone to ACP > POSTING > BBCodes > Add a new BBCode and entered
[customContact]{TEXT}[/customContact]
in BBCode usage, followed by
<div class="hello">{TEXT}</div>
in HTML replacement, submitted it, and entered
[customContact] frame [/customContact]
in the Contact Information field. When I open the page in a browser, it simply prints[customContact] frame [/customContact] in the area I'm looking to populate. I'm afraid I've never used a bbcode before, let alone created one, so I'm probably doing something embarrassingly silly :oops:


Stupid boy, scratch all that. Should know better by now that minor spelling error isn't minor after all! Okay, I think I may have a handle on it, I'll come back to you. Many thanks for advice thus far :)

Con Foozed
Registered User
Posts: 6
Joined: Sun Dec 17, 2017 1:30 pm

Re: Styling the Contact Information

Post by Con Foozed » Mon Dec 18, 2017 6:16 pm

Works an absolute treat.Many thanks to you both

Post Reply

Return to “[3.2.x] Styles Support & Discussion”

Who is online

Users browsing this forum: No registered users and 2 guests