Docs

[Kashevko]

Hi there,
I have a few questions and would really appreciate if you’ll help me to figure them out.

#1 How can I change line colors from black to white in the portfolio section?
I’m writing about the lines in which header ”Portfolio” is situated (between these lines) (http://ponylab.studio/portfolio/)

#2 Removing ”sort portfolio” button at all

I’m using this CSS code to display portfolio buttons:

.x-portfolio-filters-menu li {
display: inline-block;
}
ul.x-portfolio-filters-menu.unstyled {
display: block !important;
}
a.x-portfolio-filters.selected {
display: none;
}
a.x-portfolio-filters.cf {
display: none;

And I’d like to remove ”Sort portfolio” section at all.
When you’ll enter my portfolio page and click on ”Sort portfolio” section, it would be removed.
But how to remove it at all without clicking?

#3 How to display portfolio thumbnails in full image size?
Featured images are cutting and it doesn’t look good for some of the portfolio items: http://ponylab.studio/portfolio/

Or maybe you could tell what is the best sizes for the featured images in the portfolio so they wouldn’t be cutted?

#4 I have custom cursors on my website
The codes for the default and link cursors are:

HTML,BODY{cursor: url("link"), auto;}
HTML,a{cursor: url("link"), auto;}

And I want also to implement custom cursor for the ”pointer” cursor
( you could see it while hovering on the one from the portfolio sections like ”Logos”, ”Mobile games”, etc).

I’ve tried:

HTML,p{cursor: url("link"), auto;}
and
HTML,pointer{cursor: url("link"), auto;}

Doesn’t work.
Where am I mistaking?

#5 Mobile view

When I’m entering the website from a mobile phone, I see the menu section at the top right corner.
It’s opening after the tap on it.
How to make so that from mobile devices the menu would be already downloading opened all the time without a tap?

Also, please mention, when I tap on it, the footer flows down (disappears), so I’d like this menu on mobile be opened all time and footer should be there (no runaways)

My website is ponylab.studio
I’m using the latest version of theme ”X” and my stack is integrity.

Thanks in advance.
Regards,
Serg.

[Rad]

Hi there,

Thanks for posting in.

1. Please add this CSS

.h-landmark span:before, .h-landmark span:after {
    background-color: #fff;
}

2. This one will hide it

.x-portfolio-filters {
    display: none;
}

3. You can upload of any size, but you can follow a confirmed aspect ratio. Example, you can upload any of these sizes

862×482
1200×670
600×335

They will be rendered the same, you can use this tool http://andrew.hedges.name/experiments/aspect_ratio/. You can use 862×482 as your basis, then calculate different sizes from that one.

4. Try something like this

a{ cursor: url("link"), auto; }

5. Please add this to Admin > Appearance > Customizer > Custom > Javascript

jQuery( document ).ready( function($) {

$('.x-btn-navbar').off('touchstart touchend').trigger('click');

} );

About the footer, should it float? If yes, then please add this CSS as well

@media ( max-width: 979px ) {

.x-colophon.bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 99999;
    background: rgba(255, 255, 255, 0.1) !important;
}
.x-colophon.bottom .x-colophon-content {
    margin: 0px;
}
.site {
    padding-bottom: 33px;
}
}

Thanks!

[Kashevko]

Questions #1 and #2 are solved, Big thanks!

#3 Can you please explain on an example? I don’t fully understand.
Let’s say I have this image: http://ponylab.studio/portfolio-item/logo-for-telegram-tgchat/
I like how it displays big here as the featured image.
But I don’t like its thumbnail look from this page: http://ponylab.studio/portfolio/

I don’t like it because it doesn’t reflect the whole image.
So, what exactly should I do to display it in the portfolio thumbnail in the full aspect ratio?
This image dimension is 878×878.
Thanks in advance and sorry for being a pain.

#4 Doesn’t work. What else could we try?

#5
I have two questions here:

1) Menu opens at the all pages, but I’d like it to be opened only on the home page as on the others it doesn’t look good. How to modify it?
2) How could we make the footer not floating? I’d like it to leave as it’s now: just fixed in the bottom.

Thank you very much for your great support!

[Rad]

Hi there,

3. Ah, I thought you’re referring to a portfolio item. Please add this code to your child theme’s functions.php

  function x_featured_image( $cropped = '' ) {

    $stack     = x_get_stack();
    $fullwidth = ( in_array( 'x-full-width-active', get_body_class() ) ) ? true : false;

    if ( has_post_thumbnail() ) {

$thumb = get_the_post_thumbnail( NULL, 'entry-fullwidth', NULL );

      switch ( is_singular() ) {
        case true:
          printf( '<div class="entry-thumb">%s</div>', $thumb );
          break;
        case false:
          printf( '<a href="%1$s" class="entry-thumb" title="%2$s">%3$s</a>',
            esc_url( get_permalink() ),
            esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ),
            $thumb
          );
          break;
      }

    }

  }

4. It’s working, it’s now displaying a reddish arrow in my end while hovering the links and logo. It was a hand pointer as the default.

5. a. Replace the code with this

jQuery( document ).ready( function($) {

$('.home .x-btn-navbar').off('touchstart touchend').trigger('click');

} );

5. b. Remove the CSS. But what do you mean no runaways? Because it’s there even without that CSS. I’m not sure what you mean by fixing it in the bottom because it’s already in the bottom.

Thanks.

[Kashevko]

Question #3 solved, thanks!

4. It’s was working before.
Please, hover your cursor on the sorting portfolio buttons (”All”, ”Logos”, ”Mobile Games”, etc.)
For some reason on this items, the custom cursor doesn’t work…

5. a. Great, thanks!
By the way, on mobiles, how could we now center this menu and remove black lines?

b. Please, see the screencast.
When the menu is not opened on the mobile – you could see the footer.
But when I’m opening the menu – footer is disappearing.
https://drive.google.com/file/d/0B-B7y9ntb1DWUEx6NkVJeU93MjQ/view

Thanks.

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

ul.x-portfolio-filters-menu a.x-portfolio-filter {

    cursor: url(http://ponylab.studio/wp-includes/images/cursor.png), auto;
}
.x-navbar .mobile .x-nav li>a {
    border: none;
    text-align: center;
}

@media (max-width:979px){
footer.x-colophon.bottom {
    position: fixed;
    right: 0;
    left: 0;
    bottom: 0;
}
}

Hope that helps.

[Kashevko]

Everything works great.

You’re amazing guys, thank you!

[Christopher]

You’re welcome.

[Author]

Posts