Soft Responsive [Deleted]

How does this theme make xenporta responsive? Or does it just show the forum page as the front page for mobile devices? How does it translate your ad blocks or do you have to set new ads for the mobile version? About to buy, just need to figure this out.
 
It allows you to hide portal blocks: top left, top right, etc.. it is configurable. The rest of blocks are shown at full screen width.

As for ads, you need to adjust ad code to work with mobile devices. For example, for adsense you can use something like this (but with correct variable names and values)
Code:
if ($(window).width() > 700)
{
    ad_format = '720xwhatever';
}
else
{
    ad_format = '320xwhatever';
}
 
It allows you to hide portal blocks: top left, top right, etc.. it is configurable. The rest of blocks are shown at full screen width.

As for ads, you need to adjust ad code to work with mobile devices. For example, for adsense you can use something like this (but with correct variable names and values)
Code:
if ($(window).width() > 700)
{
    ad_format = '720xwhatever';
}
else
{
    ad_format = '320xwhatever';
}
Interesting. I currently use the rotating ads add on. Will the template hooks keep the ads in the same place?
 
No. Browser width is determined on client side, not server side, so you can't use different templates for different devices, but you can use CSS to show/hide different sets of ads. Something like this:
Code:
<div class="displayFull">
 
full ads here
 
</div>
<div class="displayResponsive" style="display:none;">
 
mobile ads here
 
</div>
and add this to extra.css
Code:
@media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
{
    .displayFull { display: none; }
    .displayResponsive { display: block !important; }
}
 
Purchased this awesome theme and very happy

E-D-I-T
Shame I purchased direct and am unable to review here, It is not often I make a purchase like this and several days later feel better than when I actually made the purchase.

5 Stars for how happy I am
4.5 Stars for end user, However after an update I am sure it will become 5
 
Proud owner.

Woot ! Woot ! :cool:

Now if only I can get paypal to push through for that add-on as well. Evil paypal can be a hassle.

responsive-design-----order.webp
 
Purchased this awesome theme and very happy

E-D-I-T
Shame I purchased direct and am unable to review here, It is not often I make a purchase like this and several days later feel better than when I actually made the purchase.

5 Stars for how happy I am
4.5 Stars for end user, However after an update I am sure it will become 5
Just press buy now, and then you should be able to review it.
 
header: I don't see such error. What browser are you using?

editor: that bug is fixed on my dev version, so it will be included in next update :)
 
Oh, I see that issue with blogs. Blog add-on overrides page_container template with its own, which causes that issue.

There is no need to override that template. That's a bug in that add-on.
 
Oh, I see that issue with blogs. Blog add-on overrides page_container template with its own, which causes that issue.

There is no need to override that template. That's a bug in that add-on.
Oh hell..... I'm wondering if I'll be able to get a solution to that... huh
 
Find template that it uses instead of page_container, move content block below header like it is in page_container
 
Find template that it uses instead of page_container, move content block below header like it is in page_container
Out of the 86 template that it adds

I assume it would be these two

xfa_blog_PAGE_CONTAINER_full_screen and xfa_blog_PAGE_CONTAINER_normal

Of course the fact there are 2 of them has thrown me for a loop (small pause in my thought process)


xfa_blog_PAGE_CONTAINER_full_screen
PHP:
<!DOCTYPE html>
<html id="XenForo" lang="{$visitorLanguage.language_code}" dir="{$visitorLanguage.text_direction}" class="Public {xen:if {$visitor.user_id}, 'LoggedIn', 'LoggedOut'} {xen:if {$sidebar}, 'Sidebar', 'NoSidebar'}" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<xen:hook name="page_container_head">
<meta charset="utf-8" />
<xen:if is="{$requestPaths.fullBasePath}">
<base href="{$requestPaths.fullBasePath}" />
<script><xen:comment>/* Chrome bug and for Google cache */</xen:comment>
var _b = document.getElementsByTagName('base')[0], _bH = "{xen:jsescape $requestPaths.fullBasePath}";
if (_b && _b.href != _bH) _b.href = _bH;
</script>
</xen:if>
 
<title><xen:if is="{$title}">{xen:raw $title} | {$xenOptions.boardTitle}<xen:else />{$xenOptions.boardTitle}</xen:if></title>
 
<noscript><style>.JsOnly { display: none !important; }</style></noscript>
<link rel="stylesheet" href="css.php?css=xenforo,form,public&amp;style={xen:urlencode $_styleId}&amp;dir={$visitorLanguage.text_direction}&amp;d={$visitorStyle.last_modified_date}" />
<link rel="stylesheet" type="text/css" href="{xen:link xfa-blog-customize/css.css, $blog}" />
<!--XenForo_Require:CSS-->
{xen:helper ignoredCss, {$visitor.ignoredUsers}}
 
<xen:include template="google_analytics" />
<xen:include template="page_container_js_head" />
 
<xen:require css="xfa_blogs.css" />
<xen:require css="xfa_blog_custom_fonts.css" />
<xen:require js="js/xfa-blogs/blog_shared.js" />
 
<xen:if is="{$pageDescription.content} AND !{$pageDescription.skipmeta} AND !{$head.description}"><meta name="description" content="{xen:string wordTrim, {xen:helper stripHtml, {xen:raw $pageDescription.content}}, 200}" /></xen:if>
<xen:if is="{$head}"><xen:foreach loop="$head" value="$headElement">{xen:raw $headElement}</xen:foreach></xen:if>
</xen:hook>
</head>
 
<body{xen:if {$bodyClasses}, ' class="{$bodyClasses}"'}>
 
<xen:include template="xfa_blog_breadcrumb"><xen:set var="$microdata">1</xen:set></xen:include>
 
<div class="{xen:if $showCustomization, 'customizeBody', ''}">
 
{xen:raw $contentOutside}
 
<div id="headerMover">
<div class="smallProxy"></div>
 
<div id="content" class="{$contentTemplate}">
<div class="pageWidth">
<div class="pageContent {xen:if $showCustomization, 'customizePageContent', ''}">
<!-- main content area -->
 
<xen:if is="{$sidebar}">
<div class="mainContainer">
<div class="mainContent"></xen:if>
 
{xen:raw $contentBeforeTitle}
 
<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>
 
<!-- main template -->
{xen:raw $contents}
 
<xen:if is="!{$visitor.user_id} AND !{$hideLoginBar}">
<!-- login form, to be moved to the upper drop-down -->
<xen:include template="login_bar_form" />
</xen:if>
 
<xen:if is="{$sidebar}"></div>
</div>
 
<!-- sidebar -->
<aside>
 
<xen:if is="{$topctrl}"><div class="topCtrl">{xen:raw $topctrl}</div></xen:if>
 
<div class="sidebar">
{xen:raw $sidebar}
</div>
</aside>
</xen:if>
 
<xen:hook name="page_container_breadcrumb_bottom">
<div class="breadBoxBottom"><xen:include template="breadcrumb" /></div>
</xen:hook>
 
<xen:include template="ad_below_bottom_breadcrumb" />
 
</div>
</div>
</div>
 
</div>
 
</div><!-- /customizeBody -->
 
<footer>
<xen:include template="footer" />
</footer>
 
<xen:include template="page_container_js_body" />
 
<xen:if is="{$cronLink}"><img src="{$cronLink}" width="1" height="1" alt="" style="display: none" /></xen:if>
 
 
 
</body>
</html>
 
I'm going over it slowly.... Trying to see where else these may play a factor into things.


xfa_blog_PAGE_CONTAINER_normal
PHP:
<!DOCTYPE html>
<html id="XenForo" lang="{$visitorLanguage.language_code}" dir="{$visitorLanguage.text_direction}" class="Public {xen:if {$visitor.user_id}, 'LoggedIn', 'LoggedOut'} {xen:if {$sidebar}, 'Sidebar', 'NoSidebar'}" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<xen:hook name="page_container_head">
    <meta charset="utf-8" />
    <xen:if is="{$requestPaths.fullBasePath}">
        <base href="{$requestPaths.fullBasePath}" />
        <script><xen:comment>/* Chrome bug and for Google cache */</xen:comment>
            var _b = document.getElementsByTagName('base')[0], _bH = "{xen:jsescape $requestPaths.fullBasePath}";
            if (_b && _b.href != _bH) _b.href = _bH;
        </script>
    </xen:if>
 
    <title><xen:if is="{$title}">{xen:raw $title} | {$xenOptions.boardTitle}<xen:else />{$xenOptions.boardTitle}</xen:if></title>
   
    <noscript><style>.JsOnly { display: none !important; }</style></noscript>
    <link rel="stylesheet" href="css.php?css=xenforo,form,public&amp;style={xen:urlencode $_styleId}&amp;dir={$visitorLanguage.text_direction}&amp;d={$visitorStyle.last_modified_date}" />
    <link rel="stylesheet" type="text/css" href="{xen:link xfa-blog-customize/css.css, $blog}" />
    <!--XenForo_Require:CSS-->   
    {xen:helper ignoredCss, {$visitor.ignoredUsers}}
 
    <xen:include template="google_analytics" />
    <xen:include template="page_container_js_head" />
   
    <xen:require css="xfa_blog_custom_fonts.css" />       
    <xen:require js="js/xfa-blogs/blog_shared.js" />   
 
    <xen:if is="{$pageDescription.content} AND !{$pageDescription.skipmeta} AND !{$head.description}"><meta name="description" content="{xen:string wordTrim, {xen:helper stripHtml, {xen:raw $pageDescription.content}}, 200}" /></xen:if>
    <xen:if is="{$head}"><xen:foreach loop="$head" value="$headElement">{xen:raw $headElement}</xen:foreach></xen:if>
</xen:hook>
</head>
 
<body{xen:if {$bodyClasses}, ' class="{$bodyClasses}"'}>
{xen:raw $contentOutside}
<xen:hook name="body">
 
<xen:if is="{$visitor.is_moderator} || {$visitor.is_admin}">
    <xen:include template="moderator_bar" />
<xen:elseif is="!{$visitor.user_id} && !{$hideLoginBar}" />
    <xen:include template="login_bar" />
</xen:if>
 
<div id="headerMover">
    <div id="headerProxy"></div>
 
<div class="{xen:if $showCustomization, 'customizeBody', ''}">   
<div id="content" class="{$contentTemplate}">
    <div class="pageWidth">
        <div class="pageContent {xen:if $showCustomization, 'customizePageContent', ''}">
            <!-- main content area -->
           
            <xen:hook name="page_container_content_top" />
           
            <xen:if is="{$sidebar}">
                <div class="mainContainer">
                    <div class="mainContent"></xen:if>
                       
                        {xen:raw $contentBeforeTitle}
                       
                        <xen:include template="ad_above_top_breadcrumb" />
                       
                        <xen:hook name="page_container_breadcrumb_top">
                        <div class="breadBoxTop">
                            <xen:if is="{$topctrl}"><div class="topCtrl">{xen:raw $topctrl}</div></xen:if>
                            <xen:include template="breadcrumb"><xen:set var="$microdata">1</xen:set></xen:include>
                        </div>
                        </xen:hook>
                       
                        <xen:include template="ad_below_top_breadcrumb" />
                   
                        <xen:hook name="page_container_notices">
                        <xen:include template="notices" />                       
                        </xen:hook>
                       
                        <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>
                       
                        <xen:include template="ad_above_content" />
                       
                        <!-- main template -->
                        {xen:raw $contents}
                       
                        <xen:include template="ad_below_content" />
                       
                        <xen:if is="!{$visitor.user_id} && !{$hideLoginBar}">
                            <!-- login form, to be moved to the upper drop-down -->
                            <xen:include template="login_bar_form" />
                        </xen:if>
                       
                    <xen:if is="{$sidebar}"></div>
                </div>
               
                <!-- sidebar -->
                <aside>
                    <div class="sidebar">
                        <xen:hook name="page_container_sidebar">
                        <xen:include template="ad_sidebar_top" />
                        <xen:if is="!{$noVisitorPanel}"><xen:include template="sidebar_visitor_panel" /></xen:if>
                        {xen:raw $sidebar}
                        <xen:include template="ad_sidebar_bottom" />
                        </xen:hook>
                    </div>
                </aside>
            </xen:if>
           
            <xen:hook name="page_container_breadcrumb_bottom">           
            <div class="breadBoxBottom"><xen:include template="breadcrumb" /></div>
            </xen:hook>
                       
            <xen:include template="ad_below_bottom_breadcrumb" />
                       
        </div>
    </div>
</div>
</div>
 
<header>
    <xen:include template="header" />
    <xen:edithint template="navigation" />
    <xen:edithint template="search_bar" />
</header>
 
</div>
 
<footer>
    <xen:include template="footer" />
</footer>
 
<xen:include template="page_container_js_body" />
 
<xen:if is="{$cronLink}"><img src="{$cronLink}" width="1" height="1" alt="" style="display: none" /></xen:if>
 
</xen:hook>
</body>
</html>
 
Top Bottom