WordPress Widgets Tutorial

แชร์
ฝัง
  • เผยแพร่เมื่อ 19 ธ.ค. 2024

ความคิดเห็น • 140

  • @LearnWebCode
    @LearnWebCode  2 หลายเดือนก่อน

    I can't believe this series is 10 years old. While a lot has changed in WordPress over the years the core concepts remain the same and I hope this series is helpful in your learning journey. For anyone who is curious, my recommendation for hosting your WordPress website is DreamHost and specifically their "Shared Unlimited" yearly plan (the exact plan I've used for 19 years). If you use my link to DreamHost it helps support my TH-cam channel and costs you nothing extra: click.dreamhost.com/aff_c?offer_id=109&aff_id=17231

  • @turnpikeike1242
    @turnpikeike1242 9 ปีที่แล้ว +2

    Your clear & concise teaching style is perfect.

  • @DavidGreen_au
    @DavidGreen_au 8 ปีที่แล้ว +19

    There's a bit of catch at the beginning of this chapter, certainly with WordPress 4.4, Widgets are not available "out of the box" so the video appears to be a little misleading at first, but by 5:00 minutes in, it's all back to normal, and the codes draws in the functionality, and then it is clear sailing from there.

    • @cooldudeloverboy
      @cooldudeloverboy 8 ปีที่แล้ว +2

      Thank you for this. Upset I was unable to find them "out of the box" as stated.

  • @ryangreencreative9686
    @ryangreencreative9686 10 ปีที่แล้ว +2

    All of your videos have been incredible. I hit a wall when I started hosting on Wordpress. I thought I'd be able to figure things out more easily than I did - it was tough for me and none of the themes were what I wanted. I'm a bit of a purist and these videos were EVERYTHING that I needed.
    Going to be recommending this to everyone I know who wants to learn. Thank you sir!

  • @kjvisual7
    @kjvisual7 8 ปีที่แล้ว

    Dang!!! Wordpress ROCKS!!!
    And so do your lessons. Jaw dropping good. Especially that final tip. WOW!!! Your training is so good, I went ahead and purchased your HTML/CSS/SASS course. I'm not a beginner, but you have so many valuable tips. Plus I have been 10yrs removed from all this. Can't be too proud right now. Plus I like the idea of "best practices".

  • @karlomiguelperez4450
    @karlomiguelperez4450 7 ปีที่แล้ว +2

    I guess its worth noting that before anybody panics and ask why their widget isn't present in their admin dashboard - relax and watch or just jump to 5:00 to start creating the widget in their customized theme.
    It's actually the author's style to immediately present to us the finished version although I guess he forgot to mention that he'll be creating it with us at the beginning of this tutorial.

  • @obedmpp
    @obedmpp 9 ปีที่แล้ว

    you just solved a 3 day problem with my widgets. I love you.

  • @kaleelahamed
    @kaleelahamed 7 ปีที่แล้ว

    This Series of classes are awesome. Its a simple and clear explanation which helps a lot. Hats off to the Author !!!!!

  • @michaelrussell738
    @michaelrussell738 8 ปีที่แล้ว +4

    Great explanation of this, really enjoying going through the various tips in the video series. I know it's a couple years old now but a lot seems to still be perfectly adequate

  • @DonnaBrooks
    @DonnaBrooks 9 ปีที่แล้ว +1

    About 10 years ago someone set me up a Drupal site that I tried to learn to manage & develop. It was totally demoralizing! The learning curve was so high and there weren't good resources online like there are now for Wordpress! I had previously taught myself HTML (thru books, studying the source code of websites, and experimentation) well enough to build a single page website to promote a conference, and it included internal & external links, photos, a PDF registration form for people to download, blah, blah, blah. But after the Drupal debacle, when CSS came along, I decided that I wasn't going to try to learn to write PHP and CSS. But your tutorials are SO clear that it's piqued my interest (and I just jumped in on this one; I didn't even start at the beginning!).

    • @ozumoo
      @ozumoo 9 ปีที่แล้ว

      +Donna Brooks time changes , my advice to you not to waste more time , good luck

  • @ThinkTeky
    @ThinkTeky 2 ปีที่แล้ว

    You're genius brad! I'm a big fan of your teaching style and tutorials. Just continue uploading new content✌🏻

  • @lauramcnally3452
    @lauramcnally3452 8 ปีที่แล้ว +1

    Hi, even as I get up to 6:00 my 'This is sidebar' AND my footer border-top and footer-nav all appear in the sidebar, however, the at the end of the footer still appears at the bottom where it should. I have tried copying and pasting the code from the zip file (index, functions, footer, sidebar) and it still happens. I have no idea where this has gone wrong! Can anyone help?

    • @mingliyang5526
      @mingliyang5526 8 ปีที่แล้ว +4

      +Laura McNally It is because the "clearfix" in the site-content is not working. My solution to this is in the CSS file , put these lines in.site-content { display : inline-block;}

    • @lauramcnally3452
      @lauramcnally3452 8 ปีที่แล้ว

      +Mingli Yang Thanks for this :)

    • @dont_blink11
      @dont_blink11 8 ปีที่แล้ว

      thanx man !

  • @Harmonics86
    @Harmonics86 9 ปีที่แล้ว +1

    Love your videos sir. They are very straight forward and your explanations are just great. Thank you very much!

  • @KristinaPopadic
    @KristinaPopadic 8 ปีที่แล้ว +7

    I just wanted to say Thank you very very much! You are really good teacher! Clear and detailed.. I am a WP-beginner, and your videos are really helpfull!! Thanks!
    Subscriber from Serbia :)

  • @skydriv3rHD
    @skydriv3rHD 7 ปีที่แล้ว

    Man Thanks alot for you amazing Tutorial , You just opened the Path Right in Front of me to enter the Wordpress World ! as Full Stack Web Developer Freelancer that is Helping me alot !

  • @mustafanoon
    @mustafanoon 8 ปีที่แล้ว

    THE BEST VIDEO! I have ever seen on explaining widgets.

  • @arinzeanakor9498
    @arinzeanakor9498 9 ปีที่แล้ว +1

    BEST WP Theme tutorials I have come across so far. Thanks man.

  • @micahturner1441
    @micahturner1441 10 ปีที่แล้ว +4

    You are an open source hero!

  • @kidnap56
    @kidnap56 9 ปีที่แล้ว +1

    Thanks!!
    absolutely great totorial..
    completely simple to understand..
    u can be my teacher at school..

  • @katrinegitz1
    @katrinegitz1 8 ปีที่แล้ว +1

    Hi! I have a question about the widgets.. When I go to my Apperance, I cannot see the widgets, and even when I click customize in the theme, they don't appear. Do I need to add something or install something to have it supported? Hope that you can help. I have so enjoyed your tutorials, I am a Wordpress beginner and you make it super understandable! Can't wait to start doing my own themes! Big thanks from Denmark!

    • @LearnWebCode
      @LearnWebCode  8 ปีที่แล้ว +2

      Hi Katrine, if "Widgets" does not appear under the "Appearance" menu in the sidebar it could be because the theme you are using doesn't support widgets. Are you creating your own theme like we're doing in this video series or did you find an existing theme you like? Later on in this video we learn how to add "Widget support" to our theme - that might help you out, or you could consider using a different theme if you aren't building your own.

  • @cyberhawk2311
    @cyberhawk2311 9 ปีที่แล้ว +6

    cannot find the widget link in appearance. what shoud i do ?

    • @ptircsi
      @ptircsi 9 ปีที่แล้ว +8

      Hitesh Bokolia Any theme without widget code in its functions.php would keep the widgets menu hidden. Have a look at this article about enabling widgets: codex.wordpress.org/Widgetizing_Themes

    • @ahmedabdou2604
      @ahmedabdou2604 4 ปีที่แล้ว

      @@ptircsi thanks so much the article u provided helped a lot

  • @neethaalex8892
    @neethaalex8892 7 ปีที่แล้ว

    " clear cut tutorial"it make super simple to beginner,thankyou very much :)

  • @FarhadMasjedizadeh_limbo
    @FarhadMasjedizadeh_limbo 9 ปีที่แล้ว

    بسیار آموزنده بود . با تشکر از شما . . .

  • @TheRoxas13th
    @TheRoxas13th 10 ปีที่แล้ว

    Absolutely great series man!!! I love it so far!!

  • @kerimtim
    @kerimtim 8 ปีที่แล้ว

    Hi. Is it possible to create or develop custom widgets, NOT areas i mean widgets from scratch without using any plugins?

  • @alphafox4284
    @alphafox4284 5 ปีที่แล้ว

    hey thank you for your hard work and i have just simple question how we can customise the widgets area like show the post thumbnail we just add this last one to show videos and thank you

  • @dhavalkumarsolanki558
    @dhavalkumarsolanki558 9 ปีที่แล้ว

    Sir ,you post video that are freaking awesome.Thanks for amazing video. I think you are best WordPress tutor I ever met.

  • @thespeakerstaffinformation8503
    @thespeakerstaffinformation8503 9 ปีที่แล้ว

    Another very helpful and useful tutorial.
    Is there a way to auto-generate div-classes for new widgets?
    For example, click "insert object." The object inserts with a div-class BOX-a (can rename). Then you can go to Widgets and assign a widget to that box?
    Thanks

  • @joeverzino
    @joeverzino 8 ปีที่แล้ว

    What and where are your previous videos on css and php? This video peaks my interest in these. I think there is a widget to add code to css?

  • @lfriedrichsen
    @lfriedrichsen 8 ปีที่แล้ว +1

    I was able to find the code to add Widgets to the Appearance menu for my custom theme here:
    www.templatemonster.com/blog/add-widget-areas-to-wordpress-guide/
    But yes, it is also explained in the video, step 2!

  • @arnoczkyzoltan6158
    @arnoczkyzoltan6158 10 ปีที่แล้ว

    Awesome tuts ... What style or template you using? I love this dark theme.

  • @philweboutsource
    @philweboutsource 10 ปีที่แล้ว +1

    Adding widgets should still depend on the design of the website and its goal.After all, you don't want to put all the widgets there that's of no use for your visitors. It also affects how responsive your website is.

  • @michaeldryburgh
    @michaeldryburgh 7 ปีที่แล้ว

    If you want to put the code for the footer widgets in a separate file, like was done for the sidebar widget, you can place that code in a template file called *sidebar-footer.php* and for the code in the footer.php file use *get_sidebar('footer');*

  • @shailyroy1169
    @shailyroy1169 7 ปีที่แล้ว

    IT HELPED A LOT BUT I am facing some problem. Can you please help me ? I want to create a side bar beside a bbpress forum. how can i change the code of the created sidebar that you taught to fit it just beside the forum ? please help..

  • @earthgraduate726
    @earthgraduate726 3 ปีที่แล้ว

    I'd like to add two buttons on my website on the header area next to the menu , i need them to be visible both in transparent and sticky header , the thing is the theme that I'm using allow me to put only one widget and i used it to put the first button , but i need to add one more button next to it , do you know how i can do it ?

  • @MatheusDalPizzol
    @MatheusDalPizzol 10 ปีที่แล้ว

    Awesome! Simple and objective! Thank you sooo much!

  • @CarliBotes
    @CarliBotes 10 ปีที่แล้ว +7

    Love these tutorials!! Thanks so much! :D :D

    • @LearnWebCode
      @LearnWebCode  10 ปีที่แล้ว +2

      Catrina Botes You're welcome - it's always nice to hear that the videos were helpful :)

  • @marcuscaldeira5439
    @marcuscaldeira5439 6 ปีที่แล้ว

    hello! what text editor/plug-in are you using, I love that it adds comments to your code too. Thanks

  • @SpicyboyCharlz
    @SpicyboyCharlz 8 ปีที่แล้ว

    Any chance you'll be making a video on how to create a custom widget?
    for example: add a widget to the sidebar that allows you to upload an image, add text, and a link

  • @shopytech4167
    @shopytech4167 3 ปีที่แล้ว

    Hi, I hope you are doing well I want to know that the social media widget is supported or not in wordpress

  • @kvrs1
    @kvrs1 9 ปีที่แล้ว

    Hi ,How to align the widget to the center of the side bar? i tried in css using margin-left but no use.Thanks.

  • @toufiqonline
    @toufiqonline 6 ปีที่แล้ว

    Dear sir i do not understand footer widget CSS what you can help me????

  • @sofiasantos7268
    @sofiasantos7268 10 หลายเดือนก่อน

    Very helpful video, thanks for the detailed explanation :)

  • @maheenaboobacker2254
    @maheenaboobacker2254 5 ปีที่แล้ว

    I added the same code of in this video. But side bar layout is some thing issue, it the dot shows first line and heading text shows second line. In this side bar error how to change?
    Just example:-
    .(dot)
    Categories(heading)

    • @jcdeaton42
      @jcdeaton42 5 ปีที่แล้ว

      Same issue. Did you find a solution?

  • @alexbarbaful
    @alexbarbaful 10 ปีที่แล้ว +1

    Hi Brad,
    Thank you a lot for your series! One of the best lessons I ever attended.
    Can you please explain how to add php code to WP page ?
    Thank you in advance

  • @Ibiscyclist
    @Ibiscyclist 6 ปีที่แล้ว +2

    My sidebar and footer mistakenly showed up AFTER the first blog post until I added this clearfix code into my style sheet:
    /* Clearfix */
    .clearfix:before, .clearfix:after { content: ""; display: table; }
    .clearfix:after { clear: both; }
    .clearfix { *zoom: 1; }

  • @opensahitya
    @opensahitya 7 ปีที่แล้ว

    my widget is not seen how to make it enable... I have used below code but not working, since I have already >>>
    register_nav_menus(array(
    'primary' => __('Primary Menu'),
    'footer' => __('Footer Menu'),
    ));

  • @JohnAldred
    @JohnAldred 9 ปีที่แล้ว

    One thing which caught me out, that I didn't hear mentioned in the video...
    WordPress doesn't like camelCase names for sidebar IDs.
    I tried to use jaLeftWidget, jaMiddleWidget and jaRightWidget for the IDs in a theme I'm working on, but it just would not save the widgets at all. Took a bit of googling, but camel case turned out to be the issue.
    As soon as I changed them to jaleftwidget, jamiddlewidget and jarightwidget, they all worked perfectly. :)

  • @GooglyMcDoubleface
    @GooglyMcDoubleface 5 ปีที่แล้ว

    How about Ads? I will check out and maybe make a test page and see if I can get things going. A sample test could do it.

  • @ezrakhan8602
    @ezrakhan8602 8 ปีที่แล้ว

    Hi Brad,
    Thanks for the wonderful tutorials, a very in depth explanation in fact.
    Got a question though:
    In Widget tutorial, to avoid repetitive writing of code, we created ‘sidebar.php’ and added code for ‘Sidebar’ and gave the call from ‘index.php’ using ‘get_sidebar();’. What if I want to add footer widgets also into sidebar.php.
    ‘Sidebar’, ‘Footer1’, ‘Footer2’, ‘Footer3’, ‘Footer3’ - all in ‘sidebar.php’. Is that possible?

  • @brutushita1
    @brutushita1 8 ปีที่แล้ว

    How do you put text into a widget image, ie put text so that when one clicks on an image they can read some text.

  • @sanimoze31
    @sanimoze31 9 ปีที่แล้ว

    Now I can finaly make my very own page and theme. Can you just tell me which program are you using? Is it DreamWeaver? I like how it works.

  • @DavidReuven
    @DavidReuven 7 ปีที่แล้ว

    Great Teaching ! Do you have paid courses ? Where ?

  • @elhassenselahy2568
    @elhassenselahy2568 7 ปีที่แล้ว

    If you have a problem like the footer menu jump to the top.
    instead of using float for .main-column and .side-column use:
    .site-content {
    display: flex;
    }
    and
    .main-column {
    margin-right: 4%;
    }

  • @Sockermonstret
    @Sockermonstret 9 ปีที่แล้ว

    Really helpful tutorials in this playlist! Thanks!

  • @sniperalex117
    @sniperalex117 7 ปีที่แล้ว

    Nice tutorials !
    How can I add class to a widget that already exists in a theme?

  • @beautifulrussiavlog5333
    @beautifulrussiavlog5333 3 ปีที่แล้ว

    Super explained.Appriciate it..I have subscribed u.

  • @wasimahmed8576
    @wasimahmed8576 8 ปีที่แล้ว

    If I dont wanna use and I want to use . bootstrap list group .. with a background color and my own font color ..

  • @kushkhurana1853
    @kushkhurana1853 5 ปีที่แล้ว

    Sir your videos are much interesting to learn something very good. Please post some videos on woocommerce like how can we show woocommerce products in our theme... Thanks in advance

  • @themeaningbehind8875
    @themeaningbehind8875 8 ปีที่แล้ว

    in which program do u write the code? :)

  • @Dharmik_Divya
    @Dharmik_Divya 7 ปีที่แล้ว

    May I add widgets only on single page? If yes then how may I select that specific page…

  • @margoumix
    @margoumix 10 ปีที่แล้ว

    I would to thank you for this good tutorial, well I have some questions.
    How about integrating social activities such as facebook, instagram, tweeter, linkedin and so on? and how about implementing your own social module?
    for example I'm managing a big size facebook group, page as well as a youtube channel
    How to integate mails service?
    What is the best alternative if you want to migrate your word press form on web hosting to another?
    And finally could you give me some good references about web site hosting?
    Thank you

  • @dennisadinata6951
    @dennisadinata6951 6 ปีที่แล้ว

    my float doesnt working. idk why, but i already use clear fix too

  • @tedtdu
    @tedtdu 8 ปีที่แล้ว

    What if I want the sidebar on the left of my website?

    • @Toochilledtocare-_-
      @Toochilledtocare-_- 8 ปีที่แล้ว

      then float your sidebar left and float the main content right.

  • @МирасНурмуханбетов
    @МирасНурмуханбетов 9 ปีที่แล้ว +2

    я не знаю English. но у тебя все так понятно спасибо большое!

  • @erichepperlewp
    @erichepperlewp 3 ปีที่แล้ว

    4:40 - How to add WIDGET SUPPORT to theme

  • @maminulhoque9449
    @maminulhoque9449 5 ปีที่แล้ว

    I want to you next tutorial uploadand explain custom taxonomy, shortcode tutorial.

  • @opensahitya
    @opensahitya 7 ปีที่แล้ว

    This one also but not show any response:
    //Add Our Widget Locations
    function ourWidgetsInit() {
    register_sidebar( array(
    'name' => 'Sidebar',
    'id' => 'sidebar1'
    ));
    }

  • @Jackweldon12
    @Jackweldon12 8 ปีที่แล้ว

    Great videos. Keep up the good work!

  • @robert_radu8731
    @robert_radu8731 3 ปีที่แล้ว

    what happen when i don't have buyght the premium in word press

  • @1Mackinzoid
    @1Mackinzoid 6 ปีที่แล้ว

    I must be a noob lol. This video just makes me want to install x-theme with cornerstone so that customization(adding widgets etc..) is that much easier. I do code in html/css/tiny bit of java. Is it possible that this video is too daunting for me and I should stick with paid plugins like x-theme/corenerstone to help?(Please don't be afraid to criticize me) Or will I learn what you're talking about in more depth if I simply attempt this while following your video? And possibly gain a beneficial knowledge of the back-end of WP? I am willing to learn this if I can customize the site enough with a pace that it saves me some money on plugins that perform similar functions. It it worth it to learn?
    (P.S. I know that this is an old video and I'm not sure but I believe that the following is true: I feel like plugins are worth paying for if they save you time with drag and drop stuff[widgets etc..] rather than having to code/learn it all. I'm coming from a "paying money VS time spent" aspect. Please reply with your thoughts, greatly appreciated)

  • @TumbleGamerTK
    @TumbleGamerTK 9 ปีที่แล้ว

    is it amateur of me to use invisible tables for columns

  • @lardoram
    @lardoram 5 ปีที่แล้ว

    I am trying to wrap my loop in a div like shown here: th-cam.com/video/QxeQBPgftRE/w-d-xo.html
    But my homepage isnt receiving the wrapper, The blog page is instead receiving the wrapper. But I have the homepage set to my static homepage in my wordpress settings.
    did anyone else have this issue?

  • @jayjayf9699
    @jayjayf9699 6 ปีที่แล้ว

    What would be good is if you told us how to get the php code

  • @mrgamer.5234
    @mrgamer.5234 4 ปีที่แล้ว +1

    Love from Pakistan 🇵🇰❤️

  • @robert_radu8731
    @robert_radu8731 3 ปีที่แล้ว

    Can i do this?

  • @SOSPromotionRecovery
    @SOSPromotionRecovery 8 ปีที่แล้ว +2

    You skipped a whole section. In part three you did not show us how to index-php section. Now I am totally loss. Thank you

    • @kushkhurana1853
      @kushkhurana1853 5 ปีที่แล้ว +1

      I am watching 23 videos of tutorial provided by this person.. He is teaching us a lot

  • @cliffr9895
    @cliffr9895 3 ปีที่แล้ว

    So helpful. Thanks a lot.

  • @Lill2888
    @Lill2888 8 ปีที่แล้ว

    How to create pagination in widget content?

  • @neelgray8076
    @neelgray8076 8 ปีที่แล้ว

    Great tutorial. Thank you.

  • @mohsin0112
    @mohsin0112 6 ปีที่แล้ว

    Thanks for this tutorial.

  • @shreyaspuri
    @shreyaspuri 4 ปีที่แล้ว

    brilliant .... god bless you !

  • @wisdom_wellness365
    @wisdom_wellness365 10 ปีที่แล้ว

    Thank you so much!

  • @tejeshragaswetha
    @tejeshragaswetha 10 ปีที่แล้ว

    how to create a widget in gmail....

  • @maminulhoque9449
    @maminulhoque9449 5 ปีที่แล้ว

    Best tutorial. Thanks

  • @akhabarshrestha9110
    @akhabarshrestha9110 9 ปีที่แล้ว

    There is no widget plz can u tell me how to add

  • @MadCoder
    @MadCoder 8 ปีที่แล้ว +1

    outclass tuts ... once u start i was bored but when you go on it is really becoming outclass

    • @RaiRizwan
      @RaiRizwan 8 ปีที่แล้ว

      LOL! same situation

  • @brendaskinner1392
    @brendaskinner1392 8 ปีที่แล้ว

    i thought on wordpress i would not have to use code?

    • @successfulpeople
      @successfulpeople 7 ปีที่แล้ว

      You don't have if you just to design basic website and don't want to edit themes or templates. If you really want to master Wordpress, you would have to write a bit of code in php which isn't very difficult.

  • @IonutSultana
    @IonutSultana 8 ปีที่แล้ว

    If anyone finds this helpful -> you try to add widget to your page but when you refresh dashboard page your widgets are gone, no trace of them.
    The solution is the following - when you name your id => "the_id_name_should_allways_be_in_lowercase".
    Hope this helps someone . Extra info here : codex.wordpress.org/Function_Reference/register_sidebar

  • @abadialemadi
    @abadialemadi 10 ปีที่แล้ว

    Amazing~!
    Thanks..

  • @romanticscents
    @romanticscents 7 ปีที่แล้ว

    thank you

  • @vivekgour3103
    @vivekgour3103 5 ปีที่แล้ว

    it's good to create widgets

  • @toufiqonline
    @toufiqonline 6 ปีที่แล้ว

    Yes i can do it.

  • @mohondas9978
    @mohondas9978 4 ปีที่แล้ว

    Thank you sir

  • @dk0r51
    @dk0r51 9 ปีที่แล้ว +2

    03:23

  • @doehillarious2819
    @doehillarious2819 5 ปีที่แล้ว

    great! the best!

  • @mohondas9978
    @mohondas9978 4 ปีที่แล้ว

    helpful videos

  • @soultouchingsongs
    @soultouchingsongs 7 ปีที่แล้ว

    Just too good :)

  • @spradohak
    @spradohak 9 ปีที่แล้ว

    you are awesome.

  • @mohammedtariq9211
    @mohammedtariq9211 5 ปีที่แล้ว

    Thanks