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

Overlays disabled, but want Lightbox ?

Discussion in 'XenForo Questions and Support' started by erich37, Jan 16, 2013.

  1. erich37

    erich37 Well-Known Member

    Hello,

    I have disabled "Overlays" at my Forum at:
    ACP > Appearance > Style Properties > Overlays and Tooltips > Enable Overlays


    So the "Membercard" (and maybe some other stuff ?) is not showing up and it is quicker to navigate the site. This is fine for my niche-website.


    However, I would like to have the "Lightbox"-popup enabled.
    Meaning:
    when an image is uploaded as a "Thumbnail", then I would like to have the "Lightbox" opening up when a user views this image.
    Currently, when you have "Overlays" disabled, when clicking onto a Thumbnail-image, then this image is opening-up in a new browser-window..... and I do not like that very much.


    Question:
    How do I enable the Lightbox-feature, but still having all the other "Overlays" disabled ?


    Appreciate your help! Thanks!
     
  2. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    You can manipulate the flag on a per-page basis:

    Admin CP -> Appearance -> Templates -> page_container_js_body

    Replace the red code:

    Code:
    <script>
    
    <xen:hook name="page_container_js_body">
    jQuery.extend(true, XenForo,
    {
    	visitor: { user_id: {$visitor.user_id} },
    	serverTimeInfo:
    	{
    		now: {$serverTimeInfo.now},
    		today: {$serverTimeInfo.today},
    		todayDow: {$serverTimeInfo.todayDow}
    	},
    	_lightBoxUniversal: "{$xenOptions.lightBoxUniversal}",
    	_enableOverlays: "@enableOverlays",
    	_animationSpeedMultiplier: "@animationSpeedMultiplier",
    	_overlayConfig:
    	{
    		top: "@overlayTop",
    		speed: {xen:calc '@overlaySpeed * @animationSpeedMultiplier'},
    		closeSpeed: {xen:calc '@overlayCloseSpeed * @animationSpeedMultiplier'},
    		mask:
    		{
    			color: "@overlayMaskColor",
    			opacity: "@overlayMaskOpacity",
    			loadSpeed: {xen:calc '@overlaySpeed * @animationSpeedMultiplier'},
    			closeSpeed: {xen:calc '@overlayCloseSpeed * @animationSpeedMultiplier'}
    		}
    	},
    	_ignoredUsers: {xen:helper json, $visitor.ignoredUsers},
    	_loadedScripts: {/*<!--XenForo_Required_Scripts-->*/},
    	_cookieConfig: { path: "{xen:jsescape $xenOptions.cookieConfig.path}", domain: "{xen:jsescape $xenOptions.cookieConfig.domain}", prefix: "{xen:jsescape $xenOptions.cookieConfig.prefix}"},
    	_csrfToken: "{xen:jsescape $visitor.csrf_token_page}",
    	_csrfRefreshUrl: "{xen:jsescape {xen:link login/csrf-token-refresh}}",
    	_jsVersion: "{$xenOptions.jsVersion}"
    });
    jQuery.extend(XenForo.phrases,
    {
    	cancel: "{xen:jsescape {xen:phrase cancel}}",
    
    	a_moment_ago:    "{xen:jsescape {xen:phrase a_moment_ago}}",
    	one_minute_ago:  "{xen:jsescape {xen:phrase one_minute_ago}}",
    	x_minutes_ago:   "{xen:jsescape {xen:phrase x_minutes_ago, 'minutes=%minutes%'}}",
    	today_at_x:      "{xen:jsescape {xen:phrase today_at_x, 'time=%time%'}}",
    	yesterday_at_x:  "{xen:jsescape {xen:phrase yesterday_at_x, 'time=%time%'}}",
    	day_x_at_time_y: "{xen:jsescape {xen:phrase day_x_at_time_y, 'day=%day%', 'time=%time%'}}",
    
    	day0: "{xen:jsescape {xen:phrase day_sunday}}",
    	day1: "{xen:jsescape {xen:phrase day_monday}}",
    	day2: "{xen:jsescape {xen:phrase day_tuesday}}",
    	day3: "{xen:jsescape {xen:phrase day_wednesday}}",
    	day4: "{xen:jsescape {xen:phrase day_thursday}}",
    	day5: "{xen:jsescape {xen:phrase day_friday}}",
    	day6: "{xen:jsescape {xen:phrase day_saturday}}",
    
    	_months: "{xen:jsescape '{xen:phrase month_1},{xen:phrase month_2},{xen:phrase month_3},{xen:phrase month_4},{xen:phrase month_5},{xen:phrase month_6},{xen:phrase month_7},{xen:phrase month_8},{xen:phrase month_9},{xen:phrase month_10},{xen:phrase month_11},{xen:phrase month_12}'}",
    	_daysShort: "{xen:jsescape '{xen:phrase day_sunday_short},{xen:phrase day_monday_short},{xen:phrase day_tuesday_short},{xen:phrase day_wednesday_short},{xen:phrase day_thursday_short},{xen:phrase day_friday_short},{xen:phrase day_saturday_short}'}",
    
    	following_error_occurred: "{xen:jsescape {xen:phrase following_error_occurred}}",
    	server_did_not_respond_in_time_try_again: "{xen:jsescape {xen:phrase server_did_not_respond_in_time_try_again}}",
    	logging_in: "{xen:jsescape {xen:phrase logging_in}}",
    	click_image_show_full_size_version: "{xen:jsescape {xen:phrase click_image_show_full_size_version}}",
    	show_hidden_content_by_x: "{xen:jsescape {xen:phrase show_hidden_content_by_x}}"
    });
    
    // Facebook Javascript SDK
    XenForo.Facebook.appId = "{xen:jsescape $xenOptions.facebookAppId}";
    XenForo.Facebook.forceInit = {xen:if $facebookSdk, true, false};
    </xen:hook>
    
    </script>
    
    ...with the blue code:

    Code:
    <script>
    
    <xen:hook name="page_container_js_body">
    jQuery.extend(true, XenForo,
    {
    	visitor: { user_id: {$visitor.user_id} },
    	serverTimeInfo:
    	{
    		now: {$serverTimeInfo.now},
    		today: {$serverTimeInfo.today},
    		todayDow: {$serverTimeInfo.todayDow}
    	},
    	_lightBoxUniversal: "{$xenOptions.lightBoxUniversal}",
    	_enableOverlays: "{xen:if "{$contentTemplate} == 'thread_view'", '1', '0'}",
    	_animationSpeedMultiplier: "@animationSpeedMultiplier",
    	_overlayConfig:
    	{
    		top: "@overlayTop",
    		speed: {xen:calc '@overlaySpeed * @animationSpeedMultiplier'},
    		closeSpeed: {xen:calc '@overlayCloseSpeed * @animationSpeedMultiplier'},
    		mask:
    		{
    			color: "@overlayMaskColor",
    			opacity: "@overlayMaskOpacity",
    			loadSpeed: {xen:calc '@overlaySpeed * @animationSpeedMultiplier'},
    			closeSpeed: {xen:calc '@overlayCloseSpeed * @animationSpeedMultiplier'}
    		}
    	},
    	_ignoredUsers: {xen:helper json, $visitor.ignoredUsers},
    	_loadedScripts: {/*<!--XenForo_Required_Scripts-->*/},
    	_cookieConfig: { path: "{xen:jsescape $xenOptions.cookieConfig.path}", domain: "{xen:jsescape $xenOptions.cookieConfig.domain}", prefix: "{xen:jsescape $xenOptions.cookieConfig.prefix}"},
    	_csrfToken: "{xen:jsescape $visitor.csrf_token_page}",
    	_csrfRefreshUrl: "{xen:jsescape {xen:link login/csrf-token-refresh}}",
    	_jsVersion: "{$xenOptions.jsVersion}"
    });
    jQuery.extend(XenForo.phrases,
    {
    	cancel: "{xen:jsescape {xen:phrase cancel}}",
    
    	a_moment_ago:    "{xen:jsescape {xen:phrase a_moment_ago}}",
    	one_minute_ago:  "{xen:jsescape {xen:phrase one_minute_ago}}",
    	x_minutes_ago:   "{xen:jsescape {xen:phrase x_minutes_ago, 'minutes=%minutes%'}}",
    	today_at_x:      "{xen:jsescape {xen:phrase today_at_x, 'time=%time%'}}",
    	yesterday_at_x:  "{xen:jsescape {xen:phrase yesterday_at_x, 'time=%time%'}}",
    	day_x_at_time_y: "{xen:jsescape {xen:phrase day_x_at_time_y, 'day=%day%', 'time=%time%'}}",
    
    	day0: "{xen:jsescape {xen:phrase day_sunday}}",
    	day1: "{xen:jsescape {xen:phrase day_monday}}",
    	day2: "{xen:jsescape {xen:phrase day_tuesday}}",
    	day3: "{xen:jsescape {xen:phrase day_wednesday}}",
    	day4: "{xen:jsescape {xen:phrase day_thursday}}",
    	day5: "{xen:jsescape {xen:phrase day_friday}}",
    	day6: "{xen:jsescape {xen:phrase day_saturday}}",
    
    	_months: "{xen:jsescape '{xen:phrase month_1},{xen:phrase month_2},{xen:phrase month_3},{xen:phrase month_4},{xen:phrase month_5},{xen:phrase month_6},{xen:phrase month_7},{xen:phrase month_8},{xen:phrase month_9},{xen:phrase month_10},{xen:phrase month_11},{xen:phrase month_12}'}",
    	_daysShort: "{xen:jsescape '{xen:phrase day_sunday_short},{xen:phrase day_monday_short},{xen:phrase day_tuesday_short},{xen:phrase day_wednesday_short},{xen:phrase day_thursday_short},{xen:phrase day_friday_short},{xen:phrase day_saturday_short}'}",
    
    	following_error_occurred: "{xen:jsescape {xen:phrase following_error_occurred}}",
    	server_did_not_respond_in_time_try_again: "{xen:jsescape {xen:phrase server_did_not_respond_in_time_try_again}}",
    	logging_in: "{xen:jsescape {xen:phrase logging_in}}",
    	click_image_show_full_size_version: "{xen:jsescape {xen:phrase click_image_show_full_size_version}}",
    	show_hidden_content_by_x: "{xen:jsescape {xen:phrase show_hidden_content_by_x}}"
    });
    
    // Facebook Javascript SDK
    XenForo.Facebook.appId = "{xen:jsescape $xenOptions.facebookAppId}";
    XenForo.Facebook.forceInit = {xen:if $facebookSdk, true, false};
    </xen:hook>
    
    </script>
    
    That will enable overlays on thread_view pages only. It's not quite what you want, but from what I can tell this is the best that can be done without modifying the javascript.
     
    erich37 and Chris D like this.
  3. erich37

    erich37 Well-Known Member

    great, thanks a lot Jake!
     

Share This Page