1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Skinning to match a wordpress theme

Discussion in 'Styling and Customization Questions' started by Dynamic, Jul 10, 2012.

  1. Dynamic

    Dynamic Well-Known Member

    Hi everyone,

    So I want to skin xenforo. I have the basics down I think, but the header is killing me. Does anyone know how to make Xenforo have this header


    I was thinking of making the banner stretching across the screen the notifications, and the rest the xenforo header and navigation.

    Any help would be appreciated.

  2. Sylar

    Sylar Well-Known Member

    Do you want the header on the WP theme to completely replace the default header?
  3. Dynamic

    Dynamic Well-Known Member

    Yup, then I will move onto the forums to match the look of the theme, and then the footer. With any luck it will look like it is meant to be part of it. So if the header matches the wordpress one, and the banner is used for notifications, it will already look very neat.
    Sylar likes this.
  4. Sylar

    Sylar Well-Known Member

    Ah, well then I won't really be able to help you. That's a mighty large undertaking, good luck with it (y)
  5. Dynamic

    Dynamic Well-Known Member

    lol thanks. If I manage to figure it out or if someone gives me a hand I will release the skin for free so others can have a ready to go xenforo theme that will suit that wordpress theme. Anyone have a clue where to start?
    Sylar likes this.
  6. Naatan

    Naatan Well-Known Member

    Are you skilled in html, javascript & css? I can explain it to you but if you are not competent with those basic web "languages" there really isn't any point unfortunately. XenForo makes it easy to skin their default theme but skinning only gets you so far, what you want is to really overhaul the default theme, for which you -will- need to get down and dirty with the source.
  7. Dynamic

    Dynamic Well-Known Member

    Hi Naatan,

    I am okay with html and css, javascript not so much. I don't want to make the xenforo skin responsive like the wordpress theme is, as I think there is a mobile skin being launched with v1.2, so I was going to allow that to be used on mobile devices. If I can get it to look the same as the wordpress theme (not actually function the same) I think it will be fine.

    Most of it I can do it bits and pieces, and some things I just ask a hand for as it is a bunch of small jobs. But getting the header and footer to look the same is beyond me. If you are willing to help, I am more than happy to listen, it is very much appreciated.

  8. Sylar

    Sylar Well-Known Member

    My opinion: Start with the footer, as there's MUCH less code to re-write down there. (y)
  9. Dynamic

    Dynamic Well-Known Member

    Okay, I have started the skinning. I will keep this thread updated just incase I do something and someone wants to know how it was done. It may also encourage people to lend a hand if they see an effort is being made :D
    Sylar likes this.
  10. Sylar

    Sylar Well-Known Member

    I'd love to see it complete, be sure to give us screenshots along the way (y)
  11. EQnoble

    EQnoble Well-Known Member

    If you have problems after a bunch of effort, let me know...since you hit the key thing yourself (trying it yourself first and then asking questions) I would be willing to help you.

    Until that time....have a blast....nothing feels better than that EUREKA! moment when you just start to get it, it is twice as nice when you do it completely on your own. :)

    Happy hunting.
    Dynamic and Sylar like this.
  12. Naatan

    Naatan Well-Known Member

    Sorry I have not responded Dynamic, I meant to but I've been quite busy and I'd need to write down quite a bit to guide you with this. I'll try to do so this weekend when I have some time.
    RobinHood and Sylar like this.
  13. Dynamic

    Dynamic Well-Known Member

    Thanks for that everyone! I really appreciate it. I'll post up some screenshots this week. I am going to try and do mostly everything without touching the code (some things will need code editing), but for the most part I *should* be able to get away with extra.css and playing around in the style settings. This is to make updating easy.

    On a side note, as opposed to xenforo developing a mobile skin, why not just make their default skin responsive. That way it will automatically have the mobile theme. Just a suggestion.
    Sylar likes this.
  14. Dynamic

    Dynamic Well-Known Member

    Okay everyone, I have made a fair bit of progress on this. I tried to modify as few templates as possible from the default skin (to make it easy to update). If you would like to see where I am at, PM me.

    Sylar likes this.
  15. LPH

    LPH Well-Known Member

    After reading this thread, I was hopeful of seeing the screenshots instead of having to PM you.

    Sorry, I'm not into the PM scene.

    Maybe you'd like to share the screenshots here as well as a link to your work. I'm sure many people would be interested.
    ryansaw and Adam K M like this.

Share This Page