[Resolved] Full Width Container on Mobile Devices is not working

Home Forums Support Full Width Container on Mobile Devices is not working

  • This topic has 10 replies, 2 voices, and was last updated 2 months ago by Leo.
Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #1366669
    Carlos

    Hello there,

    I want to use the full width container on mobile devices, but it is not working. I follow this procedure: https://generatepress.com/forums/topic/full-width-container-on-mobile-devices/

    I add in the CSS option:

    @media only screen and (max-width:800px) {
    .container {
    min-width:100% !important;
    }
    }

    My padding is 320 and I wish to change the value to: 370 with margin: 30

    Any idea please?

    #1366931
    Leo
    Staff
    Customer Support
    #1366987
    Carlos

    Leo,

    my child theme style file:

    /*
     Theme Name:   GeneratePress Child
     Theme URI:    https://generatepress.com
     Description:  Default GeneratePress child theme
     Author:       Tom Usborne
     Author URI:   https://tomusborne.com
     Template:     generatepress
     Version:      0.1
    */
    
    /*#bbuscar_cap{
        color:red;background: red;
    }*/
    .content {
        margin: 0 auto !important;
    }
    .menu.simple li{
        margin-left: 0
     }
     body .share-box{
         margin-top: -8px;
     }
    @media (min-width: 336px) and (max-width:767px) {
        .content {
            width: auto !important;
        }
        .crunchify-link{
            font-size: 11px !important;
        }
           
    }
    
    @media screen and (max-width:400px) {
        body #main-content {
            width: auto!important;
        }
        
    }
    
    @media screen and (max-width:500px) {
        .fb_iframe_widget_fluid_desktop iframe{
            width: 100% !important;
        }
        
    .entry-meta.comment-metadata {
        display: none;
    }

    My Functions file theme child:

    <?php
    /**
     * GeneratePress child theme functions and definitions.
     *
     * Add your custom PHP in this file. 
     * Only edit this file if you have direct access to it on your server (to fix errors if they happen).
     */
    
    add_action( 'wp_head', 'child_theme_head_script'); 
    function wpse62415_filter_wp_title( $title ) {
        $url = parse_url("https://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]");
                   
            foreach ($url as $key => $value) {
                if(preg_match("/^\/biblia/", $value)) {
                    $after 		= ' - Biblia DC Online';
                    $result 	= [];
                    $result2 	= [];
                    $result3 	= [];
    
                    $filepath = $_SERVER['DOCUMENT_ROOT'].$url['path'];
                    
                            if (file_exists($filepath)) {
                              $file = file_get_contents($filepath);
                              preg_match("/<h2[^>]+>(.+?)<\/h2>/", $file, $result);
                              
                              if(isset($result[1])) {
                                 $title = $result[1].$after;
                              } else {
                                    $file = file_get_contents($filepath);
                                    preg_match("/<h2>(.+?)<\/h2>/", $file, $result2);
                                    if(isset($result2[1])) {
                                        $title = $result2[1].$after;
                                } else {
                                    $file = htmlspecialchars(file_get_contents($filepath));
                                            preg_match("/<h2>(.+?)<\/h2>/", $file, $result3);
                                            if(isset($result3[1])){
                                                $title = $result3[1].$after;}
                                        else{
                                            $title = 'Biblia DC Online - Devocionales ✝ Cristianos';}
                                }
                              }
                            }
                }
            }
        return $title;
    }
    add_filter( 'wp_title', 'wpse62415_filter_wp_title',100 );
    
    /*  ----------------------------------------------------------------------------
        add the parent style + style.css from this folder
     */
    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 11);
    function theme_enqueue_styles() {
        wp_enqueue_style('td-theme', get_template_directory_uri() . '/style.css', '', TD_THEME_VERSION, 'all' );
        wp_enqueue_style('td-theme-child', get_stylesheet_directory_uri() . '/style.css', array('td-theme'), TD_THEME_VERSION . 'c', 'all' );
    
    }
    
    //add_action( 'wp_head', 'child_theme_head_script'); 
    
    	add_filter('pre_get_document_title', 'change_the_title');
    	function change_the_title($title) {
    		$url = parse_url("https://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]");
                    
    		foreach ($url as $key => $value) {
    		    if(preg_match("/^\/biblia/", $value)) {
    		     	$after 		= ' - Biblia DC Online';
    		     	$result 	= [];
    		     	$result2 	= [];
    		     	$result3 	= [];
    
    		     	$filepath = $_SERVER['DOCUMENT_ROOT'].$url['path'];
    				if (file_exists($filepath)) {
    				  $file = file_get_contents($filepath);
    				  preg_match("/<h2[^>]+>(.+?)<\/h2>/", $file, $result);
    				  if(isset($result[1])) {
    				    return $result[1].$after;
    				  } else {
    				  	$file = file_get_contents($filepath);
    				  	preg_match("/<h2>(.+?)<\/h2>/", $file, $result2);
    				  	if(isset($result2[1])) {
    			    		return $result2[1].$after;
    				    } else {
    				    	$file = htmlspecialchars(file_get_contents($filepath));
    					  	preg_match("/<h2>(.+?)<\/h2>/", $file, $result3);
    					  	if(isset($result3[1]))
    					    	return $result3[1].$after;
    					    else
    					    	return 'Biblia DC Online';
    				    }
    				  }
    				}
    		    }
    		}
    	    return $title;
    	}
    
    function theme_slug_logo_url() {
        return 'https://www.devocionalescristianos.org';
    }
    
    add_filter( 'login_headerurl', 'theme_slug_logo_url' );
    
    function theme_slug_login_logo() { ?>
        <style type="text/css">
            #login h1 a, .login h1 a {
                background-image: url(https://www.devocionalescristianos.org/wp-content/uploads/2019/01/Logo_DC_ultimo_2019-2.png);
                height:75px;
                width:320px;
                background-repeat: no-repeat;
                padding-bottom: 20px;
                background-size: 320px;
            }
        </style>
    <?php }
    
    add_filter( 'generate_post_date_output', function() {
        $time_string = '<time class="entry-date published">%2$s</time>';
    
        if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) {
            $time_string = '<time class="updated" datetime="%3$s" itemprop="dateModified">%4$s</time>';
        }
    
        $time_string = sprintf( $time_string,
            esc_attr( get_the_date( 'c' ) ),
            esc_html( get_the_date() ),
            esc_attr( get_the_modified_date( 'c' ) ),
            esc_html( get_the_modified_date() )
        );
    
        return sprintf( '<a href="%1$s" title="%2$s" rel="bookmark">%3$s</a>',
            esc_url( get_permalink() ),
            esc_attr( get_the_time() ),
            $time_string
        );
    } );
    
    if ( ! function_exists( 'generate_comment' ) ) {
    	/**
    	 * Template for comments and pingbacks.
    	 *
    	 * Used as a callback by wp_list_comments() for displaying the comments.
    	 */
    	function generate_comment( $comment, $args, $depth ) {
    		$args['avatar_size'] = apply_filters( 'generate_comment_avatar_size', 50 );
    
    		if ( 'pingback' == $comment->comment_type || 'trackback' == $comment->comment_type ) : ?>
    
    		<li id="comment-<?php comment_ID(); ?>" <?php comment_class(); ?>>
    			<div class="comment-body">
    				<?php _e( 'Pingback:', 'generatepress' ); // WPCS: XSS OK. ?> <?php comment_author_link(); ?> <?php edit_comment_link( __( 'Edit', 'generatepress' ), '<span class="edit-link">', '</span>' ); ?>
    			</div>
    
    		<?php else : ?>
    
    		<li id="comment-<?php comment_ID(); ?>" <?php comment_class( empty( $args['has_children'] ) ? '' : 'parent' ); ?>>
    			<article id="div-comment-<?php comment_ID(); ?>" class="comment-body" <?php generate_do_microdata( 'comment-body' ); ?>>
    				<footer class="comment-meta">
    					<?php
    					if ( 0 != $args['avatar_size'] ) {
    						echo get_avatar( $comment, $args['avatar_size'] );
    					}
    					?>
    					<div class="comment-author-info">
    						<div class="comment-author vcard" <?php generate_do_microdata( 'comment-author' ); ?>>
    							<?php printf( '<cite itemprop="name" class="fn">%s</cite>', get_comment_author_link() ); ?>
    						</div><!-- .comment-author -->
    
    						<div class="entry-meta comment-metadata">
    							<a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>">
    							</a>
    							<?php edit_comment_link( __( 'Edit', 'generatepress' ), '<span class="edit-link">| ', '</span>' ); ?>
    						</div><!-- .comment-metadata -->
    					</div><!-- .comment-author-info -->
    
    					<?php if ( '0' == $comment->comment_approved ) : ?>
    						<p class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.', 'generatepress' ); // WPCS: XSS OK. ?></p>
    					<?php endif; ?>
    				</footer><!-- .comment-meta -->
    
    				<div class="comment-content" itemprop="text">
    					<?php
    					/**
    					 * generate_before_comment_content hook.
    					 *
    					 * @since 2.4
    					 *
    					 */
    					do_action( 'generate_before_comment_text', $comment, $args, $depth );
    
    					comment_text();
    
    					/**
    					 * generate_after_comment_content hook.
    					 *
    					 * @since 2.4
    					 *
    					 */
    					do_action( 'generate_after_comment_text', $comment, $args, $depth );
    					?>
    				</div><!-- .comment-content -->
    			</article><!-- .comment-body -->
    		<?php
    		endif;
    	}
    }

    Any idea please?

    Thnak you very much

    #1367111
    Leo
    Staff
    Customer Support

    Try removing this:

    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 11);
    function theme_enqueue_styles() {
        wp_enqueue_style('td-theme', get_template_directory_uri() . '/style.css', '', TD_THEME_VERSION, 'all' );
        wp_enqueue_style('td-theme-child', get_stylesheet_directory_uri() . '/style.css', array('td-theme'), TD_THEME_VERSION . 'c', 'all' );
    
    }
    #1367182
    Carlos

    Hello Leo,

    delete this code work! But the padding left and right is set up in automatic to 30px, I need to change it value to 20px.

    How I can do it?

    Thank you very much!

    #1367274
    Leo
    Staff
    Customer Support

    Have you tried changing the content padding option?

    #1367276
    Carlos

    Leo,

    I don’t have the option. Where is the option? I believe that my menu configuration does not allow me to enable that option.

    Any idea?

    Thank you very much!

    #1367286
    Leo
    Staff
    Customer Support
    #1367292
    Carlos

    Leo,

    I don’t have it option.

    You can se my container here: Image

    Any idea?

    Thank you very much

    #1367293
    Carlos

    Leo,

    I’d installed the element: Spacing.

    All is ok now!

    Thank you very much!

    #1367317
    Leo
    Staff
    Customer Support
Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.