• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.2 Responsive template modifications

giorgino

Well-known member
#1
Hi all :)

I'm making some changes to my template modifications for make more responsive my sites.

One of this is:

Find:
Code:
<xen:h1>{$xenOptions.boardTitle}</xen:h1>
Replace:
Code:
<div class="visibleResponsiveFull hiddenResponsiveWide hiddenResponsiveNarrow hiddenResponsiveMedium">
<xen:h1>{$xenOptions.boardTitle} con {xen:number $boardTotals.users} Membri Registrati</xen:h1>
</div>
but don't work. What's wrong?
 

Jeremy

Well-known member
#2
The xen:h1 tag isn't evaluated immediately when its called. The <h1> that is printed out when you call <xen:h1 /> is actually contained in the template PAGE_CONTAINER.
 

giorgino

Well-known member
#5
Is this the piece of code to customize? :confused:

Code:
                        <xen:hook name="page_container_content_title_bar">
                        <xen:if is="!{$noH1}">                       
                            <!-- h1 title, description -->
                            <div class="titleBar">
                                {xen:raw $beforeH1}
                                <h1><xen:if
                                    is="{$h1}">{xen:raw $h1}<xen:elseif
                                    is="{$title}" />{xen:raw $title}<xen:else
                                    />{$xenOptions.boardTitle}</xen:if></h1>
                               
                                <xen:if is="{$pageDescription.content}"><p id="pageDescription" class="muted {$pageDescription.class}">{xen:raw $pageDescription.content}</p></xen:if>
                            </div>
                        </xen:if>
                        </xen:hook>
 

giorgino

Well-known member
#9
I simply tested something like:
Code:
<xen:hook name="page_container_content_title_bar">
                        <xen:if is="!{$noH1}">                  
                            <!-- h1 title, description -->
                            <div class="titleBar">
                                {xen:raw $beforeH1}
                                <h1><xen:if
                                    is="{$h1}">{xen:raw $h1}<xen:elseif
                                    is="{$title}" />{xen:raw $title}<xen:else
                                    />{$xenOptions.boardTitle}test</xen:if></h1>
                          
                                <xen:if is="{$pageDescription.content}"><p id="pageDescription" class="muted {$pageDescription.class}">{xen:raw $pageDescription.content}</p></xen:if>
                            </div>
                        </xen:if>
                        </xen:hook>
Look at line: />{$xenOptions.boardTitle}test</xen:if></h1>

But in this way, no word 'test' appear after the board title...
 

Jeremy

Well-known member
#10
That section is only used if the template you are viewing (specifically the page in general) doesn't utilize <xen:h1> of <xen:title> to set the H1 value. You'll either want to place your test outside of the <xen:if> completely, or use the statement 2 lines above it. If you want to hide it in responsive, just add your classes to the div that contains the <h1>.