Forum Replies Created

Viewing 15 replies - 1 through 15 (of 39 total)
  • Hi Calvin,

    Could you share a screenshot? I think it’s a CSS issue, rather than a mega menu issue. Have you heard of Firebug plugin? It’s a very simple tool that helps you debug CSS issues like these. I suggest you give it a go and see which element is overriding your style. If you could elaborate on the exact steps to reproduce the issue, I could give it a go tomorrow.

    – Mithun

    Hi Purnachandra,

    What issue are you facing? I have a similar issue with the Hueman theme. Perhaps, we’re both referring to the same issue.

    – Mithun

    Hi Calvin,

    I just took a quick look at your website because I have almost similar issue with mine. I localised the issue to the CSS element: .headerwrap .navbar

    Presently, your code looks as follows:

    .headerwrap .navbar {
        float: right;
        margin-right: 32px;
    }

    Changing your code to the one below makes the navbar appear inline:

    .headerwrap .navbar {
        float: right;
        margin-right: auto;
    }

    The issue is that the margin prevents the navbar from inline display, so it moves to the next line. Please check if the suggestion works.

    – Mithun

    Thread Starter Mithun Sridharan

    (@mithungmxnet)

    Hi Tom,

    I’ve been checking the CSS and JS files for the Hueman theme and though I’m close to the solution, I haven’t been able to nail it with a fix. So, I’d like to solicit your help.

    As I documented earlier, the plugin works flawlessly on Desktop resolutions. However, when switching to mobile, the following behaviour causes trouble. I’m attaching some screenshots to articulate the behaviour.

    On mobile, the menu perfectly renders without glitch. I’ve uploaded the screenshot to my Dropbox account. Here it is:
    https://www.dropbox.com/s/ogsikqtha9kej8a/Hide.png

    On mobile resolutions, the menu, when clcked, appears as follows:
    https://www.dropbox.com/s/jhf0hk8v0zbz10q/Show.png

    As you see, the contents between <nav> and </nav> also slide down with the panel. Could you recommend some workarounds, please?

    I’m also including the code that produces this behaviour:

    <?php if ( has_nav_menu('topbar') ): ?>
    			<nav class="nav-container group" id="nav-topbar">
    				<div class="container">
    				<?php wp_nav_menu( array('theme_location'=>'topbar') ); ?>
    				<?php insert_color_bar_separator(); ?>							
    
    					<div class="container-inner">
    						<div class="toggle-tools"><i class="fa fa-cog"></i></div>
    						<div class="tools-expand">
    							<?php echo display_clock(); ?>
    							<div class="tools-expand-inner">
    								<div class="toggle-login" title="Login / Logout"><i class="fa fa-lock"></i></div>
    								<?php if( 'on' == ot_get_option('enable-font-resizer') ) { ?>
    									<div class="toggle-plus" title="Increase font size"><i class="fa fa-plus-square-o"></i></div>
    									<div class="toggle-minus" title="Increase font size"><i class="fa fa-minus-square-o"></i></div>
    								<?php } ?>
    							</div>
    						</div>
    						<div class="toggle-search"><i class="fa fa-search"></i></div>
    						<div class="search-expand">
    							<div class="search-expand-inner">
    								<?php get_search_form(); ?>
    							</div>
    						</div>
    					</div><!--/.container-inner-->
    				</div><!--/.container-->
    
    			</nav><!--/#nav-topbar-->
    
    		<?php endif; ?>

    For all practical purpose, the styling for the contents between the navs is derived from the Hueman theme styling.

    Any ideas that could move me further?

    Thanks in advance,
    Mithun

    Thread Starter Mithun Sridharan

    (@mithungmxnet)

    Hi Tom,

    I made the modifications as you suggested in the link. The menu renders as expected on desktop layouts, but not on mobiles. The toggle buttons (e.g. search icon) follows the menu as it expands when the hamburger icon is clicked. I’ll check whether there are any CSS elements overriding the menu functionality and add to the knowledge base here.

    Thanks for looking into this. Really appreciate it.

    – Mithun

    Thread Starter Mithun Sridharan

    (@mithungmxnet)

    A quick update. After several hours of debugging, I found out that the javascript file:user-profile that was enqueued in file themed-profiles.php was dequeued elsewhere in the theme, which led to inconsistent updates across browsers. Now, the updates work consistently! Marking the issue as resolved!

    Thread Starter Mithun Sridharan

    (@mithungmxnet)

    Just to add a couple of further observations, I see that the address bar changes to
    ?updated=true
    when the profile form is updated. This is the behavior on both, Safari and Google Chrome. However, I don’t see any such change on Firefox 38. My hunch is that Firefox is blocking some redirection.

    Dear all,

    Actually, this function could be used as is. To avoid automatic appending to post content, comment out the line:

    add_filter('the_content', 'wpatt_content_filter');

    Once you’ve done this, all that’s left to do is to make a call to the function: wpatt_content_filter

    I’ve commented out the line as before and added a separate function based on the code to my functions.php. It looks like this:

    function show_attachments($content) {
        global $post;
        $somethingtoshow = 0;
        $content_l = null;
    
        $checkrestrict = false;
        if ( get_option('wpatt_option_restrictload') && !is_single() && !is_page() ) { $checkrestrict = true; }
    
        if ($post->ID == '0' || $post->ID == NULL || get_post_meta($post->ID, 'wpa_off', true) || post_password_required() || $checkrestrict ) { return $content; }
    
        $attachments = get_posts(array(
            'post_type' => 'attachment',
            'orderby' => 'menu_order',
            'order' => 'ASC',
            'posts_per_page' => 100,
            'post_parent' => $post->ID
        ));
    
        if ($attachments) {
            $content_l .= '<!-- WP Attachments --><ul class="post-attachments">';
            foreach ($attachments as $attachment) {
    
                $wpatt_option_includeimages_get = get_option('wpatt_option_includeimages');
                if ($wpatt_option_includeimages_get == '1') {
                } else if ( wp_attachment_is_image( $attachment->ID ) ) {
                    continue;
                }
                $somethingtoshow = 1;
    
                $class = "post-attachment mime-" . sanitize_title($attachment->post_mime_type);
    
                if ($wpatt_option_targetblank_get == '1') { $content_l .= 'target="_blank" '; }
    
                if ((file_exists(get_attached_file($attachment->ID)))) {
                    $wpatt_fs = wpatt_format_bytes(filesize(get_attached_file($attachment->ID)));
                } else {
                    $wpatt_fs = 'ERROR';
                }
                $wpatt_date = new DateTime($attachment->post_date);
    
                switch ( get_option('wpa_template') ) {
                    case 1: //STANDARD WITH DATE
                        $wpattachments_string = '<a href="%URL%">%TITLE%</a> <small>(%SIZE%)</small> <div style="float:right;">%DATE%</div>';
                        break;
                    case 2: //EXTENDED
                        $wpattachments_string = '<a href="%URL%">%TITLE%</a> <small>• %SIZE% • %DOWNLOADS% click</small> <div style="float:right;">%DATE%</div><br><small>%CAPTION%</small>';
                        break;
                    case 3: //CUSTOM
                        $wpattachments_string =  html_entity_decode( get_option('wpa_template_custom') );
                        break;
                    default: //DEFAULT
                        $wpattachments_string = '<a href="%URL%">%TITLE%</a> <small>(%SIZE%)</small>';
                }
    
                if ( get_option('wpatt_option_targetblank') ) {
                    $wpattachments_string = str_replace('<a href', '<a target="_blank" href', $wpattachments_string);
                }
    
                if ( get_option('wpatt_counter') ) {
                    $url = add_query_arg( 'download', $attachment->ID, get_permalink() );
                } else {
                    $url = wp_get_attachment_url($attachment->ID);
                }
                $wpattachments_string = str_replace("%URL%", $url, $wpattachments_string);
                $wpattachments_string = str_replace("%TITLE%", $attachment->post_title, $wpattachments_string);
                $wpattachments_string = str_replace("%SIZE%", $wpatt_fs, $wpattachments_string);
                $wpattachments_string = str_replace("%DATE%", $wpatt_date->format(get_option('wpatt_option_date_localization')), $wpattachments_string);
                $wpattachments_string = str_replace("%CAPTION%", $attachment->post_excerpt, $wpattachments_string);
                $wpattachments_string = str_replace("%DESCRIPTION%", $attachment->post_content, $wpattachments_string);
                $wpattachments_string = str_replace("%AUTHOR%", get_the_author_meta( 'display_name', $attachment->post_author), $wpattachments_string);
    
                $wpattachments_string = str_replace("%DOWNLOADS%", wpa_get_downloads($attachment->ID), $wpattachments_string);
    
                $content_l .= '<li class="' . $class . '">' . $wpattachments_string . '</li>';
    
                }
            $content_l .= '</ul>';
            }
    	if ($somethingtoshow == 1) {
    		$content .= $content_l;
    	} else {
    		$content .= 'No downloads available!';
    	}
        return $content;
    }

    Basically, it’s the same function as wpatt_content_filter, but I’ve added a couple of lines if no attachments are available:

    if ($somethingtoshow == 1) {
    		$content .= $content_l;
    	} else {
    		$content .= 'No downloads available!';
    	}

    The only risk is that these changes may be overwritten in case of a plugin update, but for the moment, these changes work well for me. Please note that I’m not checking whether the plugin is activated or any other checks; I’m doing these steps elsewhere in my theme, so you may want to check whether the function, wpatt_content_filter exists before using it, else you’ll see a white screen.

    – Mithun

    Hi Danny,

    I’d like to join Bike in this request. I’m using this plugin to trigger on the homepage and it will be really nice to prompt the user a few times and then leave him/her in peace. Any pointers to achieve this? Cookies?

    Thanks a lot for this plugin. It’s awesome!

    Best Regards,
    Mithun

    Hi HelpMeHelpYou,

    I found a much better solution meanwhile. With this approach you don’t need WP Page Navi plugin anymore (1 plugin less, a bit faster website).

    Please put this code in your child theme’s functions.php:

    /**
     * Infinite Scroll
     */
    function custom_infinite_scroll_js() {
    	if( ! is_singular() ) { ?>
    	<script>
    	var infinite_scroll = {
    		loading: {
    			img: 'data:image/gif;base64,R0lGODlhAQABAHAAACH5BAUAAAAALAAAAAABAAEAAAICRAEAOw==',
    			msgText: '<?php _e( '<i class="fa fa-cog fa-spin"></i>Fetching...', 'custom' ); ?>',
    			finishedMsg: "<?php _e( 'All articles fetched.', 'custom' ); ?>"
    		},
    		"nextSelector":".pagination a:last-child",
    		"navSelector":".pagination",
    		"itemSelector":".post-row",
    		"contentSelector":".post-list"
    	};
    	jQuery( infinite_scroll.contentSelector ).infinitescroll( infinite_scroll );
    	</script>
    	<?php
    	}
    }
    add_action( 'wp_footer', 'custom_infinite_scroll_js',100 );

    This approach works for me and I believe should for you too. However, you never get to the bottom of the site with this approach. The footer region has some space for widgets, which is valuable real estate. Hence, I used a “Load More” button to load posts progressively. You can find this functionality on my journal’s homepage.

    This functionality is slightly more complicated and if you’d like to have this functionality, you have to make some modifications at several places.

    To answer your query in short, yes. Infinite scrolling works with the Hueman theme.

    Best Regards,
    Mithun

    Thread Starter Mithun Sridharan

    (@mithungmxnet)

    Hi Alex,

    I localised the issue to the following javascript (scripts.js) code:

    $('.nav-toggle').on('click', function() {
    		slide($('.nav-wrap .nav', $(this).parent()));
    	});

    In this snippet, the entire nab-wrap has the listener, which was confusing at a low resolution. After making the following change, the behaviour is as expected.

    $('.nav-toggle').on('click', function() {
    		slide($('.nav-toggle ', $(this).parent()));
    	});

    Could you confirm this from your end as well, please?

    Best Regards,
    Mithun

    Hi Paul,

    I just installed a Woocommerce shop. The theme is compatible with Woocommerce, though you need to spend some time styling it to your requirements. I am sharing some steps to point you in the right direction.

    Install Woocommerce from the plugin repository
    Duplicate page.php and delete the loop. Replace it with woocommerce content.

    For example, the loop in page.php looks like this:

    <?php while ( have_posts() ): the_post(); ?>
    
    			<article <?php post_class('group'); ?>>
    
    				<?php get_template_part('inc/page-image'); ?>
    
    				<div class="entry themeform">
    					<?php if( get_post_format() ) { get_template_part('inc/post-formats'); } ?>
    					<?php the_content(); ?>
    					<div class="clear"></div>
    				</div><!--/.entry-->
    
    			</article>
    
    			<?php if ( ot_get_option('page-comments') == 'on' ) { comments_template('/comments.php',true); } ?>
    
    		<?php endwhile; ?>

    Once you replace the content, it should look like this:
    <?php woocommerce_content(); ?>

    Now you have a shopping system with your wordpress install.

    Note, however, that you need to customise your CSS and Woocommerce hooks to make the shop blend with the theme.

    Hope this helps.

    Best Regards,
    Mithun

    Good afternoon,

    I suggest you use the child theme to make the modification. In your child theme, the following line will change the background of the area where the posts appear:

    .content {
    background:red;
    }

    Here, I have used red, but you could choose any colour, including hex values.

    Hope this helps!

    Best Regards,
    Mithun

    Hi Katja,

    If I understood you correctly, you want to have a list of tags / categories, rather than the default display. You can achieve this using the following CSS code:

    .tagcloud a:link {font-size:1em!important; display:table-row;}

    Here, we are displaying the links as table rows. Please let me know if this solution works.

    alchymyth’s code should work too. I have used it several times, but finding out why it doesn’t work requires a deeper look. The CSS method should, in this case, work too. Please confirm if it does.

    Best Regards,
    Mithun

    Hi Katja,

    Perhaps, this works:

    .tagcloud a:link {font-size:1em!important;}

    I tried with the percentage value as follows on my local install and that worked too:

    .tagcloud a:link {font-size:100%!important;}

    The HTML outputs for the tags and categories in the widget are hyperlinks, so you could style them as you would normal hyperlinks.

    Best Regards,
    Mithun

Viewing 15 replies - 1 through 15 (of 39 total)