1. Dismiss Notice

Display Heading ONLY on Mobile

Discussion in 'Woodpecker WordPress Business Theme' started by marketingtypeguys, Aug 22, 2017.

  1. marketingtypeguys

    marketingtypeguys Member

    Joined:
    Apr 15, 2014
    Messages:
    79
    Likes Received:
    1
    I know by default the slider heading/text/buttons are not active. I have used the code provided for others to display, and I am able to change so description does not show, but I can't get rid of the button to leave only the main heading.

    Is there a more streamline code I could use to display ONLY the heading over the slider image?
    (no description-no buttons)

    Thanks,

    -Brian
     
    marketingtypeguys, Aug 22, 2017
    #1
  2. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    Hi,

    To remove the slider button and description, just paste the code given below in Custom CSS section.
    (Dashboard->Inkthemes->Theme Options -> Styling Options -> Custom CSS) of your dashboard.

    For the description:
    Code:
    .slider-caption-container p.slide-para {
    display: none;
}
    For the button:
    Code:
    .slider-caption-container a.slide-button {
    display: none !important;
}
    Hope this helps...!

    Thanks & Regards!
    Akbar
    InkThemes.com
     
    akbar92, Aug 23, 2017
    #2
  3. marketingtypeguys

    marketingtypeguys Member

    Joined:
    Apr 15, 2014
    Messages:
    79
    Likes Received:
    1
    That worked great. Thanks.
     
    marketingtypeguys, Aug 23, 2017
    #3
  4. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    akbar92, Aug 24, 2017
    #4
  5. marketingtypeguys

    marketingtypeguys Member

    Joined:
    Apr 15, 2014
    Messages:
    79
    Likes Received:
    1
    One more thing on this.

    I want to remove all but the heading on mobile, and leave all showing on desktop.

    Thanks in advance.
     
    marketingtypeguys, Sep 15, 2017
    #5
  6. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    Hello,

    It seems like you want to remove all heading on mobile devices, not on the desktop. If so, then just paste the code given below in Custom CSS section.
    (Dashboard->Inkthemes->Theme Options -> Styling Options -> Custom CSS) of your dashboard.

    Code:
    @media (max-width: 991px) and (min-width: 768px){
.slide-h1 {
    font-size: 33px;
    line-height: 35px;
    display: none;
}
}
    Hope this helps...!

    Thanks & Regards!
    Akbar
    InkThemes.com
     
    akbar92, Sep 16, 2017
    #6
  7. marketingtypeguys

    marketingtypeguys Member

    Joined:
    Apr 15, 2014
    Messages:
    79
    Likes Received:
    1
    Almost.

    Desktop - all show (Heading, description, button)

    Mobile - Show ONLY Heading (no description, no button)

    Thanks.
     
    marketingtypeguys, Sep 18, 2017
    #7
  8. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    Hi,

    You want (description & button) on mobile?

    It would be better for us to understand your query with the help of some edited screenshots.
    Please share some screenshots of the concerned areas of your site.

    So that we can deliver you an exact and appropriate solution to you,

    Thanks & Regards!
    Akbar
    InkThemes.com

    PS: You can create your screenshots using screenpresso (http://www.screenpresso.com).
     
    akbar92, Sep 19, 2017
    #8
  9. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    Hi,

    For the desired changes, just paste the code given below in Custom CSS section.
    (Dashboard->Inkthemes->Theme Options -> Styling Options -> Custom CSS) of your dashboard.

    Code:
    @media (max-width: 767px){
.nivo-caption {
    visibility: inherit;
}
}
@media (max-width: 767px){
p.slide-para {
    display: none;
}
}
@media (max-width: 767px){
.nivo-caption a.slide-button {
    display: none !important;
}
}
@media (max-width: 767px){
.slide-h1 {
    font-size: 25px;
}
}
    Hope this helps...!

    Thanks & Regards!
    Akbar
    InkThemes.com
     
    akbar92, Oct 18, 2017
    #9
  10. marketingtypeguys

    marketingtypeguys Member

    Joined:
    Apr 15, 2014
    Messages:
    79
    Likes Received:
    1
    Thank you. That worked as requested.
     
    marketingtypeguys, Oct 19, 2017
    #10
  11. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    akbar92, Oct 20, 2017
    #11

Share This Page