Kadence Theme Tutorial: How to Create Complex Headers?

Поделиться
HTML-код
  • Опубликовано: 7 сен 2024

Комментарии • 84

  • @wpsimplehacks
    @wpsimplehacks  3 года назад +1

    Take a look at the Kadence theme Pro here kadence-theme.com/premium/?ref=547
    ✅ If you want to be the first to be notified about the new tutorials then please subscribe to this channel. ruclips.net/channel/UCYmw1Rk69KKz887kcpCq1nA

    • @keanukason5185
      @keanukason5185 3 года назад

      dont know if anyone cares but if you're stoned like me during the covid times then you can stream all of the latest series on InstaFlixxer. I've been watching with my girlfriend these days :)

    • @tylerben6254
      @tylerben6254 3 года назад

      @Keanu Kason yup, have been using InstaFlixxer for since december myself :D

  • @adampreiser
    @adampreiser 3 года назад +7

    Great job.

  • @ByronJonesPhuket
    @ByronJonesPhuket 3 года назад +2

    No noise, no fuss awesome tutorial. Thank you

  • @patriciadome3403
    @patriciadome3403 2 года назад

    Love all your vids! I'm using the Kadence theme , instead of the Themify Ultra I bought, because of how easy you have made it to create an awesome site. I'm building my site now by just flipping thru your videos !!! Kudoes for all your hard work. Thanks so much for sharing your expertise with all of we-in's that are website Noobs and Non-techies. I've also sub-ed you.

  • @bryants148
    @bryants148 3 года назад

    Excellent video. Love all your videos, have picked up a lot from your tutorials. You make it really simple to follow especially for someone that is new to WordPress and Kadence Theme. Would really love to know how to setup WooCommerce using Kadence Theme Pro. Look forward to more tutorials.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      Glad you like them! Take a look at the comparison video between Kadence and Blocksy. There I go through the Woocommerce settings which may help you to set up your store. Video is here ruclips.net/video/FtaQ9TuIQ8o/видео.html

  • @SteveHolstein
    @SteveHolstein 3 года назад +1

    What app do you use to discover the colors , fonts and font sizes on a website? Great video, by the way. I’ve used Kadence to build four websites and I’m still learning every day thanks to creators like you.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +4

      @Steve Holstein
      I am using these Chrome extensions:
      CSS peeper for fonts, colors and basic CSS. Also, it helps you download images from site
      Colorzilla for colors
      Image Downloader for downloading images from site
      Find & replace text for editing - it is helpful if you have a lot of similar text you need to replace on the site with something else.

  • @danir.8299
    @danir.8299 3 года назад

    Clean and straight to the point😉👍 nice job

  • @KaiBuskirk
    @KaiBuskirk 3 года назад

    luv!
    Adam @ WP Crafter - Mentioned your work! THANKS you got a sub here!

  • @DivineJesusPrayers
    @DivineJesusPrayers 3 года назад

    Amazing video.Keep the good work up.
    Could you make an affiliate marketing blog website using this amazing theme. I would love that some posts are also displayed on the homepage. i look forward to such content. thanks

  • @ZachDevine
    @ZachDevine 3 года назад

    Great video, thank you! I'd suggest recording in higher resolution next time if you can. Would make the view experience much better for your audience.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      Noted!
      I used Camtasia studio but since the recording area resolution was 1919px wide RUclips decided that it will not be converted to HD. I will take care of it in the future videos.

  • @azzurramaggia8237
    @azzurramaggia8237 3 года назад

    This is awesome! Thank you very much

  • @yapchenpo95
    @yapchenpo95 3 года назад

    What's the inspector you using? Looking good!

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      CSS Peeper chrome.google.com/webstore/detail/css-peeper/mbnbehikldjhnfehhnaidhjhoofhpehk?hl=en

  • @DaKlein1
    @DaKlein1 2 года назад

    Is there a way that we can change the icons of the shopping cart or account but not only the option that kadence brings but for whatever Icon we would like to use??? Thanks a lot

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      It would be wise to ask this directly from the Kadence Support team.

  • @honeywp765
    @honeywp765 Год назад

    How to disable kadence product search modal please kindly tell me thanks

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      It would be wise to ask about it from the theme support team

  • @anotherstep619
    @anotherstep619 3 года назад

    Great tutorial!

  • @Strategicchoices
    @Strategicchoices 3 года назад

    Another sub here too, thanks to Adam P.

  • @tomfraser3086
    @tomfraser3086 Год назад

    I've designed a Header I like on one of my websites. I would like to be able to use the same Header on other websites. I cannot find a way to export the Header with all its settings (Desktop and mobile)... Can you suggest a solution ?

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      Unfortunately I don't know the answer to that one. Sorry. The only option is to export and import all customizer settings. That is header, footer, colors, typography etc. settings.

  • @arenaoftheancients8851
    @arenaoftheancients8851 3 года назад

    please upload in HIGHER quality. 480p is very blurry.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      Somehow YT did not convert this video to HD. You can see HD version here www.dropbox.com/s/fkdezm9xihwu3ao/kadence-complex-headers.mp4?dl=1

    • @arenaoftheancients8851
      @arenaoftheancients8851 3 года назад

      @@wpsimplehacks Thanks!

    • @scottasahina
      @scottasahina 3 года назад

      @@wpsimplehacks Hi, did you know that the Dropbox link isn't HD either. It is only 1078 × 556. Could you upload 1980 x 1080 HD or at the very least 1280 x 720 HD. Thanks. The content is great, but the video quality is poor.

  • @tomfraser3086
    @tomfraser3086 Год назад

    Is there a way to add a gradient to the Kadence Navigation Bar ?

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      Yes, if you know some CSS. It would be wise to ask about it from the Kadence support team.

  • @MichaelFidelis
    @MichaelFidelis 2 года назад

    amazing work Janek! I'm working with a template in Kadence Pro and ACF Pro, CPT UI. I noticed the Advanced Gallery doesnt have a dynamic content/field option. What is your work around to display a gallery via an ACF field? Thank you.

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      If you need a gallery then unfortunately, I don’t know the way to make it work with Kadence Blocks Pro and ACF. If you need a single image then Kadence Advanced image blocks and Image overlay block supports dynamic fields.

    • @MichaelFidelis
      @MichaelFidelis 2 года назад

      @@wpsimplehacks thank you Janek for the reply

  • @bySterling
    @bySterling 3 года назад

    So awesome! Curious is it possible to center (not left align) the mobile menu text?

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      It should be under Mobile header off canvas settings

  • @rishitkaria6977
    @rishitkaria6977 3 года назад

    Can you please tell how to add a category dropdown in a search bar which is shown in porto theme? Thanks in advance

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      Just add categories to the menu. Or what is it you mean?

    • @rishitkaria6977
      @rishitkaria6977 3 года назад

      @@wpsimplehacks If you check the reference Porto theme, there's a dropdown (All Categories and a down arrow) right beside the search bar and just before the search button where you can filter out the categories for your search. Is it possible to add with Kadence Pro?

  • @PlanetaJuegosPC
    @PlanetaJuegosPC 2 года назад

    How did you add more blocks to you header? i can only use 1 html

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      You need to have a Pro version to use more than one HTML elements.

  • @ChasingWhereabouts
    @ChasingWhereabouts 3 года назад

    It is very informative.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      Thanks

    • @ChasingWhereabouts
      @ChasingWhereabouts 3 года назад

      @@wpsimplehacks I have just saved it so that I can refer to this when I need to change the menu of my website. New subscriber here. Wish you all the energy for you future videos.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      @@ChasingWhereabouts Thanks. There are a lot of videos in the pipeline. One of them will be published today.

    • @ChasingWhereabouts
      @ChasingWhereabouts 3 года назад

      @@wpsimplehacks Perfect I will a keep a tab on that. Already subscribed. Do you happen to have interest in watching City cinematics. We happen to create Vlogs and Cinematic videos of cities around Europe and our website is about Europe travel as well! Would love to see taking a stroll around that.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      @@ChasingWhereabouts Unfortunately City cinematics in not my interest :)

  • @rc33844
    @rc33844 Год назад

    Is there any way to add a link in the middle header to my-account with the free version of Kadence theme?

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      Try with HTML element and add the link in it.

    • @rc33844
      @rc33844 Год назад

      Do you have a guide on how to do this, including how to select you preferred icon for the my account link?

  • @HaifengZhu-pn3uq
    @HaifengZhu-pn3uq Год назад

    hi, I have a question for you, will woocommerce slow down my site speed?

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      It depends on your hosting, images etc. stuff on your site.

    • @HaifengZhu-pn3uq
      @HaifengZhu-pn3uq Год назад

      @@wpsimplehacks I am considering buying new hosting for my site, is Bluehost good? It is really affordable, I just started and don't want to spend too much on hosting

  • @charisael3673
    @charisael3673 3 года назад

    Very good video! What is the chrome extension for inspection?

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      I use a couple of them.
      CSS Peeper chrome.google.com/webstore/detail/css-peeper/mbnbehikldjhnfehhnaidhjhoofhpehk?hl=en
      Visual Inspector chrome.google.com/webstore/detail/visual-inspector/efaejpgmekdkcngpbghnpcmbpbngoclc
      Colorzilla chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp?hl=en
      Image Downloader chrome.google.com/webstore/detail/image-downloader/cnpniohnfphhjihaiiggeabnkjhpaldj

    • @charisael3673
      @charisael3673 3 года назад

      @@wpsimplehacks thank you!

  • @manas1326
    @manas1326 3 года назад

    hi, how can i update version of my kadence theme but without loosing customisations, pls help

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      @manas shrivastava
      If you haven’t modified theme files then you should be able to update your theme without any issues and problems with customizations. If you did modify theme files (under /wp/content/themes/kadence/) then you’ll lose your customizations.
      Nevertheless, always make a backup of your site before updatind. Use Updraftplus or WPvivid plugin for backups.

  • @susanwheeler-hall
    @susanwheeler-hall 3 года назад

    Thanks another good video. Do you think making the logged in and out header with kadence will work with LMS lifter and Elementor. I make custom online course sites with ACF and elementor and not glutenberg. Thanks again

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      If you’re using Elementor then you’ll need:
      1) Either Elementor Pro or some Elementor add-on which gives you an option to use templates using shortcodes
      2) An Elementor addons which lets you hide or show an Elementor widget based on whether a user is logged in. Take a look at Visibility Logic add-on wordpress.org/plugins/visibility-logic-elementor/

    • @susanwheeler-hall
      @susanwheeler-hall 3 года назад

      @@wpsimplehacks Thanks I already use Elementor Pro, Elements plugin that expands elementor in Lifter to maximize template system, I just wondered if the Kadence header settings would work using their logged in or out page setting.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      Unfortunately I haven’t tried with Elementor but I don’t see the reason why it would not work. But, you can try out and let us know in the comments :)

  • @CatKarmaCreations
    @CatKarmaCreations 3 года назад

    Did you include the below header Element code in your Download.. If so I cannot find it ??

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      Hi,
      I did not at first since it is rather easy to to with the Kadence Blocks. But if you go to the site and download the zipped file again then now I included this template for you to use.
      Let me know how did it work out for you.

    • @CatKarmaCreations
      @CatKarmaCreations 3 года назад

      @@wpsimplehacks Many thanks, I am already creating my own in Element block. This will help others.

  • @HaifengZhu-pn3uq
    @HaifengZhu-pn3uq Год назад

    Can I use Kadence free version to build a sticky header?

    • @wpsimplehacks
      @wpsimplehacks  Год назад +1

      Yes

    • @drishtys
      @drishtys 5 месяцев назад

      ​​​​​​@@wpsimplehacksHello can I add account icon with exact similar process as you followed in kadence free version & Gutenberg blocks free version website? Like at 8:17 when I tried by clicking + button in header section I couldn't find multiple options including divider- account icon like you have here, I just have 4 options there: secondary navigation, social, button & one html, what to do how to get account icon option there without any extra plugin like you did? Please help ASAP 🙏

    • @drishtys
      @drishtys 5 месяцев назад

      ​@@wpsimplehacksDo I need any specific setup for seeing that divider and account icon options in header after clicking on plus sign?

  • @user-dh1zd7cq3y
    @user-dh1zd7cq3y 3 года назад

    Can I do The same thing with blocksy theme?

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      Almost. Currently, Blocksy does not have a search box element you see in this demo. They only have a search icon element. Also, in order to add contact info inside the header (with icon) as you see in this video, you need to install a Reusable Blocks Extended plugin which allows you to add your blocks inside the header using shortcodes. Thera are a couple of minor issues as well but otherwise you probably would be able to create something similar.
      Hopefully Blocksy Pro has more elements you can use. If it comes out I’ll probably make a similar video for Blocksy.

  • @nromzful
    @nromzful 3 года назад

    is it the pro version of kadence ?

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      Yes, I used Kadence Pro in this video.