Well , its time for me now to say : Thank you very much Alessandro , this series are amazing , simple, crystal clear , a good starting point for Wordpress theme development , keep going and Bravo !
Thank you very much, Alessandro. Your tutorials are highest quality tuts available. They are concise, comprehensive and very easy to follow. Most appreciate for your time and profession.
Hello Alex !! I want to say that you are the best!! Thx for your tutorials, thx for your fluency in english. I like you style, you read my thoughts! Thanks a lot!
Hi Alessandro, This is night number 2 for me with your videos. I did the first 7 parts last night, including getting Bootstrap configured and my menu bar styled. Anyways, your videos are amazing. Thank you so much! You rock!
Oh wow, how can you stand the sound of my voice that long? When I was learning, coding nights were my favourite, with the silence, peace, and all the time in the world to dig deeply into the code and forget about everything else. I'm really happy to know that my tutorials are helping you in your journey, but be careful, take a lot of breaks and remember to rest. A fresh rest mind is faster than a tired one. Happy Coding!
Great Idea to put in GIthub, a suggestion is you can have just one folder in your repository and in this folder with git checkout you can jump to a specific lesson or specific commit (HEAD), example: $ git checkout -f lesson_8. Thank you Alessandro, great tutorials.
Hallo Alessandro, Thank you very much for amazing Tutorials and for sharing. Can you please point me out at a Previous video that explains implantation of Bootstrap. Thanks Dejan
MEGADRIVE Jeroi Thank you for your comment, I'm super happy that these tutorials are helpful for you. The next lesson will be published later today. Happy coding!
Hi! So far I've been following your tutorials from the start, including the live stream that I just watched and they're all great. Thanks for all the time and effort you put into this, your lessons are a perfect place to start learning about Wordpress, keep it up :)
Thanks again for these vids! Also thanks for the... I don't know what to call it but "pep-talk" in the end, I did manage(after some struggle..) to create a secondary sidebar, which I use in special page "page-with-secondary-sidebar" witch I need in the future.
Oscar Arehammar AWESOME! I think you're the only one who reached and actually listened to the last part of the video. And good job on mastering the sidebar function. I also hope that my "pep-talk" didn't sound pretentious or annoying >_>
Hi, Alex! Just wanted to say thanks - I really like your tutorials so far! :) I'm intrested in frontend technologies (I'm also familiar with php) - I searched for some wordpress tutorials in youtube, and I found your channel. And some feedback: in my opinion your explanations are good, the examples also, and I think it's really cool that you show us, how we can combine other frameworks (bootstrap) with Wordpress. Thanks again, and best of wishes! :)
***** Thank you so much, I really appreciate your comment and the feedback you're giving me. I will do other videos and series with other popular frameworks and integrations. Cheers.
Hey Ale! Love your videos! Really helpful indeed. The videos have very good structure and with all the resources available, it is by far my favorite tutorial! I just have one question: How could I apply all that I have learned here to do a onepage site? Would it mean that each section would be a blog post? All the best!
Hi Alessandro! I'm looking for more! I want to finish theme but i want your advices so when we can see the next part of tutorial? Thanks again for sharing this awesome tutorial! Regards, Alex
Note to everyone thats watching this! I got stuck at saving content in the widgets, if your widget-content is not saving from your back-end please note that the widget ID in your functions.php is not allowed to have a camelCase name. Use "-" to create readability!
Greetings Alecadd. First of all, thank you for sharing your knowledge and experiences with us beginners developers for the WordPress theme thematic. :) I would like you to ask one question: Is it necessary to use bootstrap for styling, or is it allowed for us to create our own css - in a purpose if we want to sell our theme and if this could be issue which is not tolerated for selling? Do we have that kind of freedom here to create our own ideas from scratch? Thank you in forward for answer.
i watch this for the past 5 days. i just wanted to know if this only applied to blogging site or can be implemented for a business site? just say yes, and i will continue watching the rest of them. btw, best tutorial i can stick with ever.
+Sharmimi Rizal Shamiun WordPress can be used to build everything, from a blog, to a forum, to an enterprise site, etc. Infinite possibility. Here are a couple of examples of websites I built with WordPress www.alecaddd.com/web-development-showreel-may-2015/
I've just noticed that to get the second sidebar, I named the second php sidebar-2 and the id inside the array in the function 'sidebar-2'. But then, instead of using get_header(sidebar-2), you have to use get_header(2) and now it works!
+Alessandro Castellani I had some trouble getting three different sidebars to work. Initially i tried to create 3 different sidebar-X.php files and to 'connect'/hardcode those to the different page-templates however i didn't got that to work. So i deleted all sidebars.php (also the one created in this video) and included the following markup/logic in the page templates:
I used unique parameters (ie 'sidebar-1', 'sidebar-2' and 'sidebar-3') in the different pagetemplates (index.php, page-contact.php, page-about.php) and got that to work. I think i could eventually get the sidebar-x.php files to work however i think pairing it in the admin-panel is more End-user friendly. (although i think i loose some flexibility (markupwise) i get from using different sidebar-x.php files). Any thoughts about this?
thank you alessandro but how can one add custom type post not to a new page like you did here but to an existing page already in the theme? for instance the homepage. Say that page already has elements in it like 'services', 'what we offer', 'testimonials' etc. and I want to add a customised image gallery using custom post type. How do I integrate it with this old page instead of creating a new one, cos as ur lesson explained, the only option is to create a new page and suffix it with the custom type post name (e.g. single-portfolio)
Nice guide till now. Is it possible for you to add the link in the description for the live sessions before this video? Thought I missed a video from the playlist. Keep up the good work :D
Thanks for the great tutorials they have helped me understand Wordpress better. I'm trying to add sidebars left and right. I created two sidebar instances in the configuration file and called them in the index but only the first one is showing. In the markup it's showing up as "
Hi Alessandro, Thanks very much for the great tutorials. I'm trying to apply your advice using my own desired website and I've just struck a problem with dropdown menus. I have 3 pages nested beneath a parent category, but I'm not sure how to get the dropdown menu working for those three nested categories which don't look right yet... I'm going to move onto your other tutorials and try to fix this issue later as you mentioned some kind of "navwalker"... Thanks again for your great tutorials!
Yup, I did a couple of tutorials about the Walker Nav. Check the source code on my GitHub repo as well, because since the day I published those videos, a bunch of updates were released and the code base is slightly different. Cheers
Thank you for watching. I did a tutorial on how to create a custom widget in the Premium series on this channel, and I also explained how to create custom fields. Merging those together it's a piece of cake :D
20:00 the bootstrap columns don't work for me... the sidebar is still under the content, just like before. I tried applying it to the custom page too, doesn't work on either ...
+Vladimir Perić When something doesn't work in your code, try to access my GitHub repo and check my source code related to this lesson. be careful to respect the structure and hierarchy of tags.
Thanks for the tutorial, but i have a problem, i call the the archive method inside the sidebar.php, when i click in a month the url change but i still getting all the post, how i modify the query for that?
Hi great tutorial i am learning alot from it .. but I want to ask .. how to customize sidebar .. like if I use designed menu or Categories .. like its showing Dots I want to put in the like that .. how can I do it .. ??????? Kindly reply early ..
in order to get almost same nav-bar for latest version of wordpress, you can use this bootstrap code in "functions.php" require get_template_directory() . '/bootstrap-navwalker.php'; register_nav_menus( array( 'menu-1' => esc_html__( 'Primary', 'theme-textdomain' ), ) ); "header.php" file add this snippet after body opening tag Awesome Theme
I wonder if you could help me Alex! I have an image type of post with some text overlaying an image, and i'd like to rezise that so it doesn't overlay the text... but i don't know how, thanks for this great tutorials btw.
I am at lecture 8 of WP 101 series, I have added the Bootstrap and Menu is created , but I am unable to implement the style on tag , your Tag is styled with BS but mine is not , even I try to add class in the inspect element but no results , even i have completed the first live session , still unable to understand, please guide
Thanks for the video. And i also did multiple sidebars. For showing different sidebar on different page i made different sidebar pages [ like sidebar-img.php ] then pass 'img' argument in get_sidebar() [ get_sidebar('img'); ]. Is this the best way?
You can have multiple files or just one file handling multiple sidebars. It doesn't exist an exact right or wrong way, just keep your code clean and find the best solution for your necessity. Happy Coding!
Hi Alessandro, How can you change the media query for the navigation if you have more nav items than fit in your nav? In my case I want it to collapse at 1200px. I am using Bootstrap 3.3.7. It would also be great if you could talk about how to adjust the logo area for an image. If you don't work with Bootstrap, then it can be challenging to make the code do what you want (more time spent).
You can rewrite the media queries of Bootstrap, or write new one pretty easy to cover a specific case like for your menu. I handled more advanced CSS in the Premium Development Series :D
hey alessio i appreciate the video. i used the same code as you for the sidebar but my wordpress is not showing the widget menu. could it be possible that wordpress changed its codebase? does this code work on the latest version of wordpress?
Yes thank you, that Lektion was hard to follow, i will need to get some Bootstrap Tut. I have modified the Theme to be one site Webpage. but i have stuck at "Post Loop" I have set Categories but i don't know how display specific Articles to specific Sektion of my Webpage.
Okay I was looking at the theme twentyfifteen''s functions.php and it does not seem as difficult to understand anymore thanks to you. ::) also I was wondering if you could help me prepare for a page I am trying to create. I want to make my own wp theme and use a plugin that can post the main profile pic and link to FB page of all my family member as a genealogy page for my family.
I have an interesting situation. The content of my widgets have different styling. I need to find out how to set the classes of each widget elements like li-list-tags and a-link-tags etc...
Just a word about jquery inclusion, from the live session (it wont let me comment there).. you can use wp_deregister_script('jquery') to remove the built in call to jquery, then recreate your own with wp_enqueue_script to add it again with footer argument set to true. Either include the same path that wordpress uses for jquery originally or include google's cdn of jquery. this lets you put it in the footer.
hello !! I am following your videos but in a previous video you don't have a arranged menu bar so in this you directly show the arranged menu bar and lot of changes in it. so totally confused right now. help me dear.
Hey man, I followed every step on your video but when i copy paste youe header.php its wont show as it did at your video, also i copy the nav bar from getbootstrap, its diffrent then yours tryed and it does not work properly, so my question is what too remove or add so i can make theme to look like yours? thanks alot
Is it normal that inside my widgets area, the widgets keep nesting inside rather than stacking next to each other or did i do something wrong? Thanks for your answer and you are awesome.
Hi Alessandro. in scripts inclusion in functions.php. You call wp_enqueue_script(); 3 times whereas there are 2 js scripts inside js folder. Is it redundant to call the 'wp_enqueue_script('jquery');'?
yo man :D I am makin a wordpress website. and I made the sidebar, but I dont manage to float that sidebar where I want it to go, right now it is on the left side, but I want to move it to the right side
Hello, When specifying an additional sidebar into a new location, how do I render only that sidebar. Example: I used the It rendered the original 'sidebar' as well as the new 'sidebar2'
Brett Levine Hi, sorry for the delay in the answer. How did you defined the new sidebar in your functions.php file? Be sure to check if the name of the new sidebar is identical to the one that you're calling in the function get_sidebar() Let me know. Cheers
Alessandro Castellani All is correct, I believe the issue I am having is the ability to pick which sidebar displays on which page. Correct me if I am wrong, I can do this like such: Define sidebar location on specific page template: What if I want to use wordpress side (user side) to choose which sidebar displays on which page. Currently in index.php is:
Which defines the sidebar in general, but when I print using my sidebar.php, it simply prints both of the 2 side bars on every page. What is best way to display only 1 of the 2 sidebars on page 5, but on page 6 display the other sidebar?
As I say in the video, I did a Live Development session before this video, where I integrated the code. You can find the video in the Live Development session playlist, or the updated source code in the github repo.
You can create another menu in your admin panel, create a new menu location the same way we created the first one, and then use the wp_nav_menu to print the new menu wherever you want.
One more: In sidebar.php you're using the class widget-area. In the functions.php before, the class for the widget was custom. Does it not matter? In the Codex, the say "sidebar-" would automatically be "prepended to the class value" (parameters: codex.wordpress.org/Function_Reference/register_sidebar). So should it not be "sidebar-custom" in the sidebar.php? ... just asking ... still struggling on my first theme :-)
Mhhh, that's a good question, I don't remember as I did this tutorial some years ago. Overall, I'd suggest following what the documentation says, and trust that instead of my videos :D Also, you should check the new version of the docs, as the codex will be removed sometimes in the future: developer.wordpress.org/reference/functions/register_sidebar/
Thanks for the info about the codex. I was looking at both, and thought the codex had more details. But new is obviously better. One more question, if I may :-), about what's there (the new docs link in your reply for register_sidebar). They use wpdocs_theme_slug_widgets_init (quoted from Codex under User Contributed Notes at the bottom). Can you tell me what a _theme_slug_ is? (I didn't find an answer consistent with examples anywhere, not even in codex.wordpress.org/Glossary). The question relates to your stuff like this: You use awesometheme for the folder name of the theme. In style.css you use Awesome Theme. In the functions (for where themename_ is sometimes used a placeholder in the place where they now say _theme_slug_ ), you use just awesome (like in awesome_widget_setup), which is only part of the theme name or folder name. I've used the name of the folder my theme is in now (so all small letters and one word), and it worked all right. But is that the best way (what's meant by Theme Slug/Theme Name), and what I should be doing? Sorry to pester you about your stuff of some years ago, but your newer stuff (the videos of 2 years ago) is more complex (I'll watch them later). This here is just so much more my level :D
Hi, I could get the sidebar on the 'About Me' page but could not get it on the 'Contact' page which we had named 'page-notitle.php'. How do I bring it? Thanks.
add_action('Widgets_init', 'ricSchools_container_sidebar'); look careful at the HOOK....thats what i typed....never knew WP codex is case-sensitive too....couldnt get my widgets to work for 5hrs until i changed 'Widgets_init' to 'widgets_init' Thanks though for the great tutorial..........u dont know how much you have SUPER SIMPOLLY imparted in someone's life down here in Nigeria
hi, I'm trying to customize my tag cloud. Using the default tag cloud that comes with wp I made a custom sidebar and have my tag cloud appearing there. It shows up fine but with all the tags on the site. I want only the tags of the post per post. Like tags for Post 1b only will display tag cloud with tags added to Post 1b. I found some php that looks like it would work from 2012. I tried to edit my site with it in the category-template.php file but it didn't work. I was then told it would probably go in the single.php file. I saw your video about the single.php, but it looks like it would only edit the actual post area...anyway here is the code.. // Get the assigned tag_id $tag_ids = wp_get_post_tags( $post->ID, array( ‘fields’ => ‘ids’ ) ); // Check if there is any tag_ids, if print wp_tag_cloud if ( $tag_ids ) { wp_tag_cloud( array( ‘unit’ => ‘px’, // font sizing choice (pt, em, px, etc) ‘include’ => $tag_ids, // ID’s of tags to include, displays none except these ) ); } ?> I also tried making a snippet of the code and placing it in the post but didn't work. What do you think?
Alessandro... i watched all the parts but in part8 i saw many changes to the code that i do not have. For example bootstrap scripts enqueue and classes to get my theme responsive. Did i miss something? How could i watch these changes so that i could add them step by step? Congrats again. I learned a lot.
Thodoris Thodorisk Hi there, thank for the comment, I'm really happy you're following the entire series. Yes, the theme changed a lot and all these edits come from the Live Development Session that I did in between tutorial number 7 and 8, Here's the video -> th-cam.com/video/OSYbTkzuyDg/w-d-xo.html I know it's a bit long, 1.5h, but no worries, as usual if you don't want to follow the entire session you can download the updated code from GitHub and take a look at what I did.
+Alessandro Castellani Thanks for making awesome tuts. Thank you for clarifying about the changes in part 8. It would be great if you can add an annotation in the video so that other people don't get confused about the changes.
+Faysal Ahamed I'm actually saying it in the video, exactly at the minute 1:02 I will add a note anyway at the beginning of the video. Thank you for the heads up!
Hi Alessandro, another great tutorial from you again. Must admit I'm starting to like wordpress after following your tutorials. However, I'm getting a bit of problem and need your help. Just for an exercise, I'd like to create another sidebars and call it "name=Sidebar-Aboutme" with "id=sidebar-2" in the functions.php. My question is how to declare the second dynamic_sidebar() in sidebar.php. At the moment, I have dynamic_sidebar('sidebar-1'); in sidebar.php. I tried to create another php file called it "Aboutme.php" (thinking that WP will invoke it when it looks for "sidebar-Aboutme"). In Aboutme.php, I have defined "dynamic_sidebar('sidebar-2');". Then, in my page-notitle.php, the last bit that calls for "get_sidebar()", I have defined it as "get_sidebar('Sidebar-Aboutme');". This didn't work for me. The goal of this exercise is to show up a totally different widget for the page-notitle. I hope I haven't confused you yet with my question. Thank you in advance
+daniel lee You can achieve this goal in many ways. The easiest one is to create another sidebar in your functions.php file with the function register_sidebar(array( 'id' => 'about-me' )); In the page-notitle.php you than have to just print your new sidebar with dynamic_sidebar('about-me') It's not necessary to create a unique file and it's easier to maintain and update. Cheers
***** avere un file sidebar da includere dove vuoi ti da molto più controllo modulare. Immagine di avere la stessa sidebar in 10 diversi file, se ad un certo punto decidi di cambiarla o disattivarla, puoi farlo globalmente aggiornando solo un file invece di 10
Hi Alessandro, first of all - thank you for the tutorial! And now the question: if in the function.php in ..._widget_setup() the new register_sidebar(...) is added, and in page-notitle.php dynamic_sidebar is printed (while in sidebar.php only one dynamic_sidebar is printed), in the WP menu only one widget is shown... is it correct?
The pagination is not included in the class 'four columns', but when I run this, the pagination is also on the right of the site (right above the sidebar). Could you help me figure out that?
Hi, I'm watching the Part 8 video, but comparing to the Part 7, there are so many codes added to the functions.php or other files. Are there any videos I'm missiong to watch?
After setting up a second sidebar in de functions.php, how do I request that second sidebar on a specific page?
Just changing the 1 into a 2 doesn't seem to work and setting up a second-sidebar.php doesn't seem like the right thing to do. Please help. Thanks you!
Nevermind. You do have to setup more sidebar.php files. But it's important to write it like sidebar-something.php, because WordPress can recognize sidebar-something.php files with the get_sidebar(); command. That's why second-sidebar.php doesn't work.
Thank you for your videos~ As level goes up, it is getting difficult. I have a question. Where do you find the class library? Is there anywhere I can find what types of classes are preset? You've been typing things like class="entry-header", class="entry-title", class = "col-xs-12 col-sm-4"... Where can I find these? Please help~
+Mark Won The "entry-*" classes are a generic convention from WordPress, but it not obligatory to use them. The "col-*" type of classes are from the grid system of Bootstrap. getbootstrap.com/
Alessandro Castellani Thank you, by the way. This course is really good, It´s helping me achieve my goal of developing WP themes , which is something I´ve wanted for a while now.
i created my custom sidebar, but if i add some widgets (widget downloaded when i choose the theme on my wordpress site) them are no styled, so how can i give them the same style as if i create a standard sidebar. What i want to do is to create a sidebar equal to the previous one, so with the same style got from the style.css into my theme but customizing just the markup code after the widget title
Ciao Alessandro e grazie per il tuo utilissimo lavoro, ho però un problema con la seconda sidebar che vorrei far apparire per prova in alcune pagine soltanto. Come da te spiegato ho generato un file sidebar-2.php contentente oltre al markup che si riferisce all'id specificato nell'array per la generazione backend. Nella pagina specifica (page-x.php) ho inserito appunto la funzione ma mi stampa solamente la prima. Nel backend ho già personalizzato la seconda sidebar, ma non riesco mai a visualizzarla nel frontend.
+Alessandro Castellani If not possible create only file, sidebar.php, and when call "get_sidebar(); to define which code we wanted it to be executed? Because inside the sidebar.php exist a structure IF which to define which code is executed. E.G: //Index.php:
I have created multiple sidebars on the widgets page, per your recommendation, but I am have having difficulty displaying the sidebars on each side of the page, they display on the right or the left, but not on both sides. I have used the suggested Bootstrap grid configuration from the Bootstrap website. I have tried may different configurations with the grid but have not made any advancement. Do you have any ideas. Thank you.
Lifetime Entrepreneur Hey, thanks for the comment. It's kinda hard giving you advice without checking the code. I'm setting up collaboration with an online platform for my followers to share their own code privately with me, so I can take a look and fix errors or give suggestions. In a couple of days will be up and totally free. I will release a video with all the info, I hope you can wait a bit and you will join the platform, so I can help you better! Cheers
Hi Alessandro, Are you still working with coding? I need to create a side bar on my blog and I don't dare to do it... Could I maybe get in contact with you somehow?
Hey! my sidebar us not appearing in the right side it is just there below the content of the page.... and when i am using your code in spite of sidebar my footer is appearing n the right ............ What to do ?
Well , its time for me now to say : Thank you very much Alessandro , this series are amazing , simple, crystal clear , a good starting point for Wordpress theme development , keep going and Bravo !
+Mouloud Allache Thank you so much for following and for you amazing feedback. Cheers!
I enjoyed learning wordpress with your tutorials. They are easy to follow, very simple and straight forward. Thank's a million.
Thank you so much!
Thank you very much, Alessandro. Your tutorials are highest quality tuts available. They are concise, comprehensive and very easy to follow. Most appreciate for your time and profession.
Hello Alex !! I want to say that you are the best!! Thx for your tutorials, thx for your fluency in english. I like you style, you read my thoughts! Thanks a lot!
+Dani Chirita Oh wow, thank you so much for your kind comment, I'm glad my mind reading powers are getting stronger!
Thanks for watching :D
Hi Alessandro,
This is night number 2 for me with your videos. I did the first 7 parts last night, including getting Bootstrap configured and my menu bar styled. Anyways, your videos are amazing. Thank you so much! You rock!
Oh wow, how can you stand the sound of my voice that long?
When I was learning, coding nights were my favourite, with the silence, peace, and all the time in the world to dig deeply into the code and forget about everything else.
I'm really happy to know that my tutorials are helping you in your journey, but be careful, take a lot of breaks and remember to rest. A fresh rest mind is faster than a tired one.
Happy Coding!
Haha, your voice is fine my friend. Makes it more interesting to me. Thanks again :-)
Thanks for the great videos Ale! Your instructions are clear and easy to understand, that's really cool!!
Happy to hear that!
Great Idea to put in GIthub, a suggestion is you can have just one folder in your repository and in this folder with git checkout you can jump to a specific lesson or specific commit (HEAD), example: $ git checkout -f lesson_8. Thank you Alessandro, great tutorials.
+Carlos Thank you for your suggestion. I agree, the git checkout is the way to go. Cheers
Hallo Alessandro,
Thank you very much for amazing Tutorials and for sharing.
Can you please point me out at a Previous video that explains implantation of Bootstrap.
Thanks Dejan
Hey Alessandro, thank you very much. I am so happy that I found your tutorial!
Waiting your 9th lesson this has helped me a lot to build my companys custom theme for wordpress.
MEGADRIVE Jeroi Thank you for your comment, I'm super happy that these tutorials are helpful for you. The next lesson will be published later today. Happy coding!
Hi! So far I've been following your tutorials from the start, including the live stream that I just watched and they're all great. Thanks for all the time and effort you put into this, your lessons are a perfect place to start learning about Wordpress, keep it up :)
+NGC7603 Thank you so much or your positive feedback. Happy to help you!
Thanks again for these vids!
Also thanks for the... I don't know what to call it but "pep-talk" in the end,
I did manage(after some struggle..) to create a secondary sidebar, which I use in special page "page-with-secondary-sidebar" witch I need in the future.
Oscar Arehammar AWESOME! I think you're the only one who reached and actually listened to the last part of the video. And good job on mastering the sidebar function.
I also hope that my "pep-talk" didn't sound pretentious or annoying >_>
Boy, I had a big delay (learning Angular, React, and PHP). As usual, you made it easy, or should I say, super simple. Thanks!
It's never too late to learn, thank you so much for watching :D
Thank you very much Alessandro, this tutorial is helping me a lot!!! Greetings from the Dominican Republic, keep it up!
+Eddy Carlos Ceballo García Hi, thank you so much for your comment. I'm really happy to hear that my tutorials are helpful for you.
Happy Coding!
Hi, Alex!
Just wanted to say thanks - I really like your tutorials so far! :) I'm intrested in frontend technologies (I'm also familiar with php) - I searched for some wordpress tutorials in youtube, and I found your channel.
And some feedback: in my opinion your explanations are good, the examples also, and I think it's really cool that you show us, how we can combine other frameworks (bootstrap) with Wordpress.
Thanks again, and best of wishes! :)
***** Thank you so much, I really appreciate your comment and the feedback you're giving me.
I will do other videos and series with other popular frameworks and integrations.
Cheers.
nothing beats you. You are awesome man.
simply the best! thank you Alessandro.
Love the way you say "Super simple" And great tutorial btw, keep it up ;)
Thank you. A bunch of users suggested I do a T-shirt about it :D
+Alessandro Castellani haha Good idéa :P
to have a full responsive navbar you should add in the header.php
Thnak you for making this series it helped alot and made me learn alot.
Thank you for watching!
Thanks again, very up-to-date tutorial and free, thats so hard to find
Happy you found it :D
Hey Alessandro, this series is amazing. Thank you very much!
Jonathas Duarte Happy to here that. Thank you!
Thank you for the WordPress tutorials, very informative.
Lifetime Entrepreneur Thanks to you for the comment. I'm glad you like my tutorials. Cheers
Thank you for such detailed explanation
you are just AMAZING!
I was wondering bootstrap integration with wordpress a lot!
Hey Ale! Love your videos! Really helpful indeed. The videos have very good structure and with all the resources available, it is by far my favorite tutorial! I just have one question: How could I apply all that I have learned here to do a onepage site? Would it mean that each section would be a blog post? All the best!
Hi Alessandro!
I'm looking for more! I want to finish theme but i want your advices so when we can see the next part of tutorial?
Thanks again for sharing this awesome tutorial!
Regards,
Alex
Note to everyone thats watching this! I got stuck at saving content in the widgets, if your widget-content is not saving from your back-end please note that the widget ID in your functions.php is not allowed to have a camelCase name. Use "-" to create readability!
Thanks for sharing your experience,
Happy Coding!
This was the most helpful comment i ever read! Thanks :D
If you copy-paste every file and folder from GitHub everything works fine.
your tutorial makes me another step
its really awesome
thank you :)
Greetings Alecadd.
First of all, thank you for sharing your knowledge and experiences with us beginners developers for the WordPress theme thematic. :)
I would like you to ask one question:
Is it necessary to use bootstrap for styling, or is it allowed for us to create our own css - in a purpose if we want to sell our theme and if this could be issue which is not tolerated for selling? Do we have that kind of freedom here to create our own ideas from scratch?
Thank you in forward for answer.
i watch this for the past 5 days. i just wanted to know if this only
applied to blogging site or can be implemented for a business site? just
say yes, and i will continue watching the rest of them. btw, best
tutorial i can stick with ever.
+Sharmimi Rizal Shamiun WordPress can be used to build everything, from a blog, to a forum, to an enterprise site, etc.
Infinite possibility.
Here are a couple of examples of websites I built with WordPress www.alecaddd.com/web-development-showreel-may-2015/
Many many thanks for your tuts! You earned my donation and my respect :)
Thank you so much, this makes me really happy :D
I've just noticed that to get the second sidebar, I named the second php sidebar-2 and the id inside the array in the function 'sidebar-2'. But then, instead of using get_header(sidebar-2), you have to use get_header(2) and now it works!
ow up well done alessandro i did all the tutorials like you the same way .. i hope you be continue till last point
karwan mino Thank you for the comment. I'm happy you're following the tutorials. I'm recording the new one right now! Cheers.
i will drink all of your words dear alessandro !
you are my grand special teacher i will be with you till getting the top !!! just see !
Another great one.
I especially like that you suggested to do homework
+eL Jay Yeah, but nobody did anything, so I stopped asking for homework after this XD
+Alessandro Castellani
I had some trouble getting three different sidebars to work. Initially i tried to create 3 different sidebar-X.php files and to 'connect'/hardcode those to the different page-templates however i didn't got that to work.
So i deleted all sidebars.php (also the one created in this video) and included the following markup/logic in the page templates:
I used unique parameters (ie 'sidebar-1', 'sidebar-2' and 'sidebar-3') in the different pagetemplates (index.php, page-contact.php, page-about.php) and got that to work.
I think i could eventually get the sidebar-x.php files to work however i think pairing it in the admin-panel is more End-user friendly. (although i think i loose some flexibility (markupwise) i get from using different sidebar-x.php files).
Any thoughts about this?
EXCELLENT tutorial!!!
Thank you so much
Reis, sen var ya MÜTHİŞSİN.
thank you alessandro but how can one add custom type post not to a new page like you did here but to an existing page already in the theme?
for instance the homepage. Say that page already has elements in it like 'services', 'what we offer', 'testimonials' etc. and I want to add a customised image gallery using custom post type. How do I integrate it with this old page instead of creating a new one, cos as ur lesson explained, the only option is to create a new page and suffix it with the custom type post name (e.g. single-portfolio)
Nice guide till now. Is it possible for you to add the link in the description for the live sessions before this video? Thought I missed a video from the playlist. Keep up the good work :D
Sure, will do that, thanks for watching!
loved it. thanks again dear
Thank you very much! I realize it is very easy!
Thanks for the great tutorials they have helped me understand Wordpress better. I'm trying to add sidebars left and right. I created two sidebar instances in the configuration file and called them in the index but only the first one is showing. In the markup it's showing up as "
Hi Alessandro, Thanks very much for the great tutorials. I'm trying to apply your advice using my own desired website and I've just struck a problem with dropdown menus. I have 3 pages nested beneath a parent category, but I'm not sure how to get the dropdown menu working for those three nested categories which don't look right yet... I'm going to move onto your other tutorials and try to fix this issue later as you mentioned some kind of "navwalker"... Thanks again for your great tutorials!
I see that in Tutorial 14 you address this exact issue :)
Yup, I did a couple of tutorials about the Walker Nav.
Check the source code on my GitHub repo as well, because since the day I published those videos, a bunch of updates were released and the code base is slightly different.
Cheers
Great tutorial.
Bartosz Świerczek Thank you!
Very useful video! Is it also possible to make a widget that automaticly creates sidebars in a specific template, but with custom fields for links?
Thank you for watching.
I did a tutorial on how to create a custom widget in the Premium series on this channel, and I also explained how to create custom fields. Merging those together it's a piece of cake :D
You are a LEGEND!!!!!...... Thank you so much..
Eheheh, you're very welcome :D
20:00 the bootstrap columns don't work for me... the sidebar is still under the content, just like before. I tried applying it to the custom page too, doesn't work on either ...
+Vladimir Perić When something doesn't work in your code, try to access my GitHub repo and check my source code related to this lesson. be careful to respect the structure and hierarchy of tags.
Thanks for the tutorial, but i have a problem, i call the the archive method inside the sidebar.php, when i click in a month the url change but i still getting all the post, how i modify the query for that?
Hi great tutorial i am learning alot from it .. but I want to ask .. how to customize sidebar .. like if I use designed menu or Categories .. like its showing Dots I want to put in the like that .. how can I do it .. ??????? Kindly reply early ..
in order to get almost same nav-bar for latest version of wordpress, you can use this bootstrap code in "functions.php"
require get_template_directory() . '/bootstrap-navwalker.php';
register_nav_menus( array(
'menu-1' => esc_html__( 'Primary', 'theme-textdomain' ),
) );
"header.php" file
add this snippet after body opening tag
Awesome Theme
Thanks for sharing
I wonder if you could help me Alex! I have an image type of post with some text overlaying an image, and i'd like to rezise that so it doesn't overlay the text... but i don't know how, thanks for this great tutorials btw.
I am at lecture 8 of WP 101 series, I have added the Bootstrap and Menu is created , but I am unable to implement the style on tag , your Tag is styled with BS but mine is not , even I try to add class in the inspect element but no results
, even i have completed the first live session , still unable to understand, please guide
Dude you are a life saver Thank you so much :)
Oh wow, thank you so much :D
Thanks for the video. And i also did multiple sidebars. For showing different sidebar on different page i made different sidebar pages [ like sidebar-img.php ] then pass 'img' argument in get_sidebar() [ get_sidebar('img'); ].
Is this the best way?
You can have multiple files or just one file handling multiple sidebars.
It doesn't exist an exact right or wrong way, just keep your code clean and find the best solution for your necessity.
Happy Coding!
Hi Alessandro,
How can you change the media query for the navigation if you have more nav items than fit in your nav? In my case I want it to collapse at 1200px. I am using Bootstrap 3.3.7. It would also be great if you could talk about how to adjust the logo area for an image. If you don't work with Bootstrap, then it can be challenging to make the code do what you want (more time spent).
You can rewrite the media queries of Bootstrap, or write new one pretty easy to cover a specific case like for your menu. I handled more advanced CSS in the Premium Development Series :D
Alessandro Castellani Thanks.
hey alessio i appreciate the video. i used the same code as you for the sidebar but my wordpress is not showing the widget menu. could it be possible that wordpress changed its codebase? does this code work on the latest version of wordpress?
Yes thank you,
that Lektion was hard to follow, i will need to get some Bootstrap Tut.
I have modified the Theme to be one site Webpage.
but i have stuck at "Post Loop"
I have set Categories but i don't know how display specific Articles to specific Sektion of my Webpage.
+Dejan Vjestica Keep following the series and you will learn everything you need.
Okay I was looking at the theme twentyfifteen''s functions.php and it does not seem as difficult to understand anymore thanks to you. ::) also I was wondering if you could help me prepare for a page I am trying to create. I want to make my own wp theme and use a plugin that can post the main profile pic and link to FB page of all my family member as a genealogy page for my family.
I have an interesting situation. The content of my widgets have different styling. I need to find out how to set the classes of each widget elements like li-list-tags and a-link-tags etc...
Just a word about jquery inclusion, from the live session (it wont let me comment there).. you can use wp_deregister_script('jquery') to remove the built in call to jquery, then recreate your own with wp_enqueue_script to add it again with footer argument set to true. Either include the same path that wordpress uses for jquery originally or include google's cdn of jquery. this lets you put it in the footer.
Yup, I found this method right after the live session :D
Thanks for sharing
great tutorials !
+Motiur Rahman thank you so much
hello !! I am following your videos but in a previous video you don't have a arranged menu bar so in this you directly show the arranged menu bar and lot of changes in it. so totally confused right now. help me dear.
Hey man, I followed every step on your video but when i copy paste youe header.php its wont show as it did at your video, also i copy the nav bar from getbootstrap, its diffrent then yours tryed and it does not work properly, so my question is what too remove or add so i can make theme to look like yours? thanks alot
Hi Ales, where can i watch the video during your cleanup and bootstrap integration on part 7
Is the first vido of the live development session playlist.
Cheers
Is it normal that inside my widgets area, the widgets keep nesting inside rather than stacking next to each other or did i do something wrong? Thanks for your answer and you are awesome.
Hi Alessandro. in scripts inclusion in functions.php. You call wp_enqueue_script(); 3 times whereas there are 2 js scripts inside js folder. Is it redundant to call the 'wp_enqueue_script('jquery');'?
Usually, WordPress enqueues jQuery by default in every front-end, and enqueuing one more time doesn't create any problem.
yo man :D I am makin a wordpress website. and I made the sidebar, but I dont manage to float that sidebar where I want it to go, right now it is on the left side, but I want to move it to the right side
In header.php file div container class is automatically generated or we are adding. confused iam a beginner of developing site.
Hello,
When specifying an additional sidebar into a new location, how do I render only that sidebar.
Example: I used the It rendered the original 'sidebar' as well as the new 'sidebar2'
Brett Levine Hi, sorry for the delay in the answer.
How did you defined the new sidebar in your functions.php file?
Be sure to check if the name of the new sidebar is identical to the one that you're calling in the function get_sidebar()
Let me know.
Cheers
Alessandro Castellani All is correct, I believe the issue I am having is the ability to pick which sidebar displays on which page. Correct me if I am wrong, I can do this like such:
Define sidebar location on specific page template:
What if I want to use wordpress side (user side) to choose which sidebar displays on which page.
Currently in index.php is:
Which defines the sidebar in general, but when I print using my sidebar.php, it simply prints both of the 2 side bars on every page. What is best way to display only 1 of the 2 sidebars on page 5, but on page 6 display the other sidebar?
You're my hero 💪
Your last video did not include the css/code requirements to get the menu(s) looking like menus. Please help!
As I say in the video, I did a Live Development session before this video, where I integrated the code.
You can find the video in the Live Development session playlist, or the updated source code in the github repo.
Thanks, I will look for the live development session. Are you for hire to create custom themes and plugins?
i just had problems with bootstrap nav menu bar in wordpress, how to add another bootsrap menu for example in another area?
You can create another menu in your admin panel, create a new menu location the same way we created the first one, and then use the wp_nav_menu to print the new menu wherever you want.
Hi Alessandro,
Is there any way you could help me to set up a sidebar on my theme's home page? It currently does not support a sidebar. Thank you
+L Betan If you follow the tutorial series you will be able to create a new sidebar and apply it wherever you want in your theme.
happy coding!
Thank your sir. you are great!
Cheers
One more: In sidebar.php you're using the class widget-area. In the functions.php before, the class for the widget was custom. Does it not matter? In the Codex, the say "sidebar-" would automatically be "prepended to the class value" (parameters: codex.wordpress.org/Function_Reference/register_sidebar). So should it not be "sidebar-custom" in the sidebar.php? ... just asking ... still struggling on my first theme :-)
Mhhh, that's a good question, I don't remember as I did this tutorial some years ago.
Overall, I'd suggest following what the documentation says, and trust that instead of my videos :D
Also, you should check the new version of the docs, as the codex will be removed sometimes in the future: developer.wordpress.org/reference/functions/register_sidebar/
Thanks for the info about the codex. I was looking at both, and thought the codex had more details. But new is obviously better.
One more question, if I may :-), about what's there (the new docs link in your reply for register_sidebar). They use wpdocs_theme_slug_widgets_init (quoted from Codex under User Contributed Notes at the bottom). Can you tell me what a _theme_slug_ is? (I didn't find an answer consistent with examples anywhere, not even in codex.wordpress.org/Glossary).
The question relates to your stuff like this: You use awesometheme for the folder name of the theme. In style.css you use Awesome Theme. In the functions (for where themename_ is sometimes used a placeholder in the place where they now say _theme_slug_ ), you use just awesome (like in awesome_widget_setup), which is only part of the theme name or folder name. I've used the name of the folder my theme is in now (so all small letters and one word), and it worked all right. But is that the best way (what's meant by Theme Slug/Theme Name), and what I should be doing?
Sorry to pester you about your stuff of some years ago, but your newer stuff (the videos of 2 years ago) is more complex (I'll watch them later). This here is just so much more my level :D
for the menu how you did the design
bro and thank you so much
I applied bootstrap, check the Live development session to see the entire process.
Hi,
I could get the sidebar on the 'About Me' page but could not get it on the 'Contact' page which we had named 'page-notitle.php'. How do I bring it?
Thanks.
+SS What' the code are you using to call the sidebar in the Contact page?
+Alessandro Castellani
This is the code:
This is my static title
Posted on: at , in
hello Alessandro Castellani
can u please tell me how to integrate bootstrap in awesome wordpress theme
+saini42787 Hi, thanks for following. You can see how I integrated Bootstrap in this video.
th-cam.com/video/OSYbTkzuyDg/w-d-xo.html
Happy Coding!
add_action('Widgets_init', 'ricSchools_container_sidebar');
look careful at the HOOK....thats what i typed....never knew WP codex is case-sensitive too....couldnt get my widgets to work for 5hrs until i changed 'Widgets_init' to 'widgets_init'
Thanks though for the great tutorial..........u dont know how much you have SUPER SIMPOLLY imparted in someone's life down here in Nigeria
Oh yeah, you're right and I forgot to mention it, the hooks and actions are case sensitive.
Thanks for watching and Happy Coding :D
hi, I'm trying to customize my tag cloud. Using the default tag cloud that comes with wp I made a custom sidebar and have my tag cloud appearing there. It shows up fine but with all the tags on the site. I want only the tags of the post per post. Like tags for Post 1b only will display tag cloud with tags added to Post 1b. I found some php that looks like it would work from 2012. I tried to edit my site with it in the category-template.php file but it didn't work. I was then told it would probably go in the single.php file. I saw your video about the single.php, but it looks like it would only edit the actual post area...anyway here is the code..
// Get the assigned tag_id
$tag_ids = wp_get_post_tags( $post->ID, array( ‘fields’ => ‘ids’ ) );
// Check if there is any tag_ids, if print wp_tag_cloud
if ( $tag_ids ) {
wp_tag_cloud( array(
‘unit’ => ‘px’, // font sizing choice (pt, em, px, etc)
‘include’ => $tag_ids, // ID’s of tags to include, displays none except these
) );
}
?>
I also tried making a snippet of the code and placing it in the post but didn't work. What do you think?
Alessandro... i watched all the parts but in part8 i saw many changes to the code that i do not have. For example bootstrap scripts enqueue and classes to get my theme responsive. Did i miss something? How could i watch these changes so that i could add them step by step? Congrats again. I learned a lot.
Thodoris Thodorisk Hi there, thank for the comment, I'm really happy you're following the entire series.
Yes, the theme changed a lot and all these edits come from the Live Development Session that I did in between tutorial number 7 and 8, Here's the video -> th-cam.com/video/OSYbTkzuyDg/w-d-xo.html
I know it's a bit long, 1.5h, but no worries, as usual if you don't want to follow the entire session you can download the updated code from GitHub and take a look at what I did.
oh allright! i will watch it! thanks a lot!
+Thodoris Thodorisk I also noticed the same thing and looking at the comment section if someone already commented about it.
+Alessandro Castellani Thanks for making awesome tuts. Thank you for clarifying about the changes in part 8. It would be great if you can add an annotation in the video so that other people don't get confused about the changes.
+Faysal Ahamed I'm actually saying it in the video, exactly at the minute 1:02
I will add a note anyway at the beginning of the video. Thank you for the heads up!
I don't find the previous video where you explan the integration of Bootstrap.
Can you provide the link?
It was from a Live Development session: th-cam.com/video/OSYbTkzuyDg/w-d-xo.html
Hey Alecadd, how is it going? :)
Just wondering, what if I want my sidebar on the left?
Ty :)
All good here!
What you ask is pretty easy, just move the sidebar column div before the content column div.
That's it!
Hi Alessandro, another great tutorial from you again. Must admit I'm starting to like wordpress after following your tutorials. However, I'm getting a bit of problem and need your help. Just for an exercise, I'd like to create another sidebars and call it "name=Sidebar-Aboutme" with "id=sidebar-2" in the functions.php. My question is how to declare the second dynamic_sidebar() in sidebar.php. At the moment, I have dynamic_sidebar('sidebar-1'); in sidebar.php. I tried to create another php file called it "Aboutme.php" (thinking that WP will invoke it when it looks for "sidebar-Aboutme"). In Aboutme.php, I have defined "dynamic_sidebar('sidebar-2');". Then, in my page-notitle.php, the last bit that calls for "get_sidebar()", I have defined it as "get_sidebar('Sidebar-Aboutme');". This didn't work for me. The goal of this exercise is to show up a totally different widget for the page-notitle. I hope I haven't confused you yet with my question. Thank you in advance
+daniel lee You can achieve this goal in many ways.
The easiest one is to create another sidebar in your functions.php file with the function
register_sidebar(array(
'id' => 'about-me'
));
In the page-notitle.php you than have to just print your new sidebar with dynamic_sidebar('about-me')
It's not necessary to create a unique file and it's easier to maintain and update.
Cheers
***** avere un file sidebar da includere dove vuoi ti da molto più controllo modulare. Immagine di avere la stessa sidebar in 10 diversi file, se ad un certo punto decidi di cambiarla o disattivarla, puoi farlo globalmente aggiornando solo un file invece di 10
Hi Alessandro, first of all - thank you for the tutorial! And now the question: if in the function.php in ..._widget_setup() the new register_sidebar(...) is added, and in page-notitle.php dynamic_sidebar is printed (while in sidebar.php only one dynamic_sidebar is printed), in the WP menu only one widget is shown... is it correct?
how did you add bootstrap? I need to know how to add bootstrap.
I did in the first video of the Live Development Session, take a look at that playlist.
Happy Coding!
in my theme , post format option is not coming..and error also not showing please tell me why,,,
My code is like this:
The pagination is not included in the class 'four columns', but when I run this, the pagination is also on the right of the site (right above the sidebar). Could you help me figure out that?
So good! :D thanks
Hi, I'm watching the Part 8 video, but comparing to the Part 7, there are so many codes added to the functions.php or other files.
Are there any videos I'm missiong to watch?
Yes, sorry, I did a live development session where I implemented Bootstrap. Check that video in the Live Streaming playlist.
After setting up a second sidebar in de functions.php, how do I request that second sidebar on a specific page?
Just changing the 1 into a 2 doesn't seem to work and setting up a second-sidebar.php doesn't seem like the right thing to do.
Please help.
Thanks you!
Nevermind. You do have to setup more sidebar.php files. But it's important to write it like sidebar-something.php, because WordPress can recognize sidebar-something.php files with the get_sidebar(); command. That's why second-sidebar.php doesn't work.
Thank you for your videos~ As level goes up, it is getting difficult. I have a question. Where do you find the class library? Is there anywhere I can find what types of classes are preset?
You've been typing things like class="entry-header", class="entry-title", class = "col-xs-12 col-sm-4"... Where can I find these?
Please help~
+Mark Won The "entry-*" classes are a generic convention from WordPress, but it not obligatory to use them.
The "col-*" type of classes are from the grid system of Bootstrap. getbootstrap.com/
is there a copy of the video from the session where you converted the theme to Bootstrap? thanks
Yes, you can check the first video of the Live Development Sessions Playlist.
Alessandro Castellani Thank you, by the way. This course is really good, It´s helping me achieve my goal of developing WP themes , which is something I´ve wanted for a while now.
Eduardo Trevino Really happy to hear that :D
I cant see it :( may i ask a link? btw thanks for the tutorial. :)
i created my custom sidebar, but if i add some widgets (widget downloaded when i choose the theme on my wordpress site) them are no styled, so how can i give them the same style as if i create a standard sidebar. What i want to do is to create a sidebar equal to the previous one, so with the same style got from the style.css into my theme but customizing just the markup code after the widget title
Keep watching my lessons and you'll learn everything you need
Sir I need little help. My WordPress theme is not showing sidebar.
Ciao Alessandro e grazie per il tuo utilissimo lavoro, ho però un problema con la seconda sidebar che vorrei far apparire per prova in alcune pagine soltanto.
Come da te spiegato ho generato un file sidebar-2.php contentente oltre al markup che si riferisce all'id specificato nell'array per la generazione backend. Nella pagina specifica (page-x.php) ho inserito appunto la funzione ma mi stampa solamente la prima. Nel backend ho già personalizzato la seconda sidebar, ma non riesco mai a visualizzarla nel frontend.
Scusami ho risolto, bastava e non
+Francesco Brachini Ottimo lavoro! Grazie mille per i complimenti, Happy Coding!
+Alessandro Castellani If not possible create only file, sidebar.php, and when call "get_sidebar(); to define which code we wanted it to be executed? Because inside the sidebar.php exist a structure IF which to define which code is executed.
E.G:
//Index.php:
//sidebar.php
If (x) {
} elseif (y) {
} else {
echo "Doesn't exist sidebar";
}
doesnt work for me :(
I have created multiple sidebars on the widgets page, per your recommendation, but I am have having difficulty displaying the sidebars on each side of the page, they display on the right or the left, but not on both sides. I have used the suggested Bootstrap grid configuration from the Bootstrap website. I have tried may different configurations with the grid but have not made any advancement. Do you have any ideas. Thank you.
Lifetime Entrepreneur Hey, thanks for the comment. It's kinda hard giving you advice without checking the code. I'm setting up collaboration with an online platform for my followers to share their own code privately with me, so I can take a look and fix errors or give suggestions. In a couple of days will be up and totally free. I will release a video with all the info, I hope you can wait a bit and you will join the platform, so I can help you better!
Cheers
Hi Alessandro, Are you still working with coding? I need to create a side bar on my blog and I don't dare to do it... Could I maybe get in contact with you somehow?
Hi Sir, Can you make a video for Lesson 7 A ?. I want to know how you do it. Step by Step. Thanks :)
+tOrpfx Protacio hi, I already did that video. Go inside my playlists and check the first video of the live development session. Happy Coding
Hey! my sidebar us not appearing in the right side it is just there below the content of the page.... and when i am using your code in spite of sidebar my footer is appearing n the right ............ What to do ?
Are you using my same version of Bootstrap, 3.3.7? If you're using Bootstrap 4, the css classes are slightly different.
if i want to make navbar of wp_nav_menu() must use WP_Bootstrap_Navwalker? or do you have the tutorial of that? please
I did a tutorial about the walker nav class in future videos of this series.
Cheers
oh thank you, i try to makenavbar about home, about me, contact on video 8, but the bootstrap not working. lol
Check my source code on Github to see if you have any issue
what is your github link?