michaelmossey

I just realized you wrote about a custom HTML block. In fact, I do want to do my whole post in HTML. So that will solve my problem. I’ll see if I can get it to work.

EDIT: accept my apologies for yelling in the original post (below). I didn’t see your mention of the custom HTML block when I first read your first reply. I was looking at everything else in your reply, but the real solution for me is the custom HTML block. It’s perfect.

original post:

DON’T send me to a page build forum. I DON’T WANT TO USE A PAGE BUILDER.

I’m asking about entering raw HTML.

By the way, who moved this thread to “Fixing WordPress”? This has nothing with fixing WordPress. I’m asking about the behavior of the code editor when entering raw HTML. The behavior is what it is. It’s not broken. But I would like to understand if there is a way to use the code editor to enter raw HTML without any post-processing.

• This reply was modified 6 years, 2 months ago by michaelmossey.

By “block” I didn’t mean Gutenberg blocks. I meant the things that are used by Page Builders in traditional WordPress visual editor plugins. I guess I don’t know what those are called, officially. “widgets?” And I didn’t mean that I’m just changing the order. I mean that I’m changing the type of widget/block/whatever and possibly redistributing the text among the blocks. This is a common “refactoring” of pages I do when I’m messing around with a bunch of draft versions of the page.

Point is, that rearranging a page including the type of display element is very easy in raw HTML.

I was hoping you would know of a reference in a more general sense.

But, I’ll ask a specific q. Below is the markup for my menus, copied from the developer’s tools window. To keep it short, I omitted some details that I think aren’t relevant.

One style I want to apply is changing the background color of the menu buttons.

This worked on the top-level buttons:

li.menu-item a {
color: #fff;
background-color: #18ddb1;
}

But the background color of the sub-menus is still white, unchanged from the original. I tried using any or all of the following selectors to add a new background color to the sub-menus:

li
li.menu-item
.sub-menu li
.sub-menu a
.sub-menu span

and similar combinations. Nothing changed the background color of the submenu (although some of them seemed to affect the area right around the text, just not the whole sub menu)

<nav id=”genesis-nav-primary”
class=”nav-primary genesis-responsive-menu”>
<div class=”wrap”>
<ul id=”menu-mine”
class=”menu genesis-nav-menu menu-primary js-superfish sf-js-enabled
sf-arrows”
style=”touch-action: pan-y;”>
<li id=”menu-item-??”
class=”menu-item menu-item-type-post_type
menu-item-object-page menu-item-??”>

<span itemprop=”name”> …menu item text… </span>

<button class=”sub-menu-toggle>
</button>
<ul class=”sub-menu”>
<li id=”menu-item-??” class=”menu-item menu-item-type-post_type
menu-item-object-page menu-item-??”>

<span> .. menu item text .. </span>

</div>
</nav>

I’ve been looking at the CSS in Firefox developer tool’s, but there are problems with this approach. I’d really like to know “from first principles”, that is a comprehensive guide to how markup is used in WordPress menus, rather than hack on it. Here are some problems with hacking:

(1) some things I’m doing SIMPLY AREN’T WORKING even though I’m copying the CSS in the developer toolbar. I must be missing something, but rather than hack on it more, I think I should now look for a reference.

(2) it’s not obvious what level of generality or specificity to use in a selector … do I make it specific, and then find out later it breaks sometimes? Or do I make it general, and then find out it messes with other parts of the website?

(3) It’s not obvious from hacking on it when I’ve finally found and handled every situation

(4) the submenus are dynamic and I can’t figure out whether their markup is changed by JS when they fire.

I’ve been poking around my theme documentation and it’s pathetic. Barely covers anything.

One additional fact: I don’t think it’s Visual Composer that my theme includes. I realize that this forum is not for theme support, but what I’m trying to do is get a sense of background for how themes evolve so that I might have a better clue how to look for documentation.

My theme says it includes “Unyson” which is a “collection of extensions,” that include Page Builder. It has pathetically sparse documentation on Page Builder. It only takes ten minutes with Page Builder to realize that there are dozens of options that aren’t mentioned in the Creatus documenation.

To add to the confusion, I thought that Page Builder was something the company Site Origin produced, yet Site Origin isn’t mentioned in my theme’s documentation.

The documentation says that they “enhanced” the Unyson extensions, but gives no clue how.

So I guess what I’m trying to understand is the big picture here. In WordPress, do different companies borrow or steal names from each other, for instance? If something is called Page Builder “by Site Origin” but in other places is called “Page Build by Unyson” are those likely to be the same thing? Or could they be totally unrelated?

Furthermore, many of the undocumented features of my theme look like they could really be pretty general purpose ideas. Like, you can name classes or ids of components in Page Builder and then add custom CSS. This brings up a whole host of questions that seem to be fairly general purpose material that a good course could address. How do I know what layout options should be handled by my theme, and how do I know what is best handled by custom CSS?

I got on customer support with my theme, to ask a very simple question: how to make the text narrower in posts to limit it to 12 to 13 words per line. Well they gave me an answer that doesn’t work because they are trying to hack it with percentage widths. Their “solution” obviously breaks down in many cases. When I asked for a real solution, they just waved their hands and mumbled something about Page Builder, providing no details.

It just seems like all this stuff should really be good material for a course.

Sure, if I spent hundreds of hours becoming a WordPress theme developer, I could probably grasp what is going on. I’m a programmer and I have a smidgeon of web experience so I’m not clueless about PHP and CSS. But the problem, of course, is that WordPress does things in its own way. I looked at the structure of a single post page, and it had something like ten nested containers. Containers within containers within containers, all with different classes. This gives me no clue what is going on.

It got frustrating when I wanted to do something that should be the most natural thing in the world, limit text width to 12-14 words per line, and I get nothing but complicated answers that don’t work anyway.

Thanks for your help!

I’m most interested in learning the functionality which seems to be standard across themes. I tried several themes, and I think the common functionality was Visual Composer. What I mean is that they all included it.

I searched Udemy and did find several courses on Visual Composer. So I’ll probably start there.

Mike

Thanks, Freddie! I see your point about underscores and ACF. If or when I hire someone to style the site, they would probably be happy I started that way.

But this also raises some issues around a balance between how much I can do myself and how much I hire someone to do. To be honest, I am time-rich and cash-poor right now. Ideally I could do a LOT myself, and maybe make good use of the page builders.

Then I might hire someone for a fixed-price job to style the site. I know this raises other questions, like the working environment that developers prefer. I am a programmer, not for the web, but I know it sucks when my boss tries to dictate every single last thing about how I’m going to work. I know that if I advertise for a job to “style this site I built,” that a lot of developers aren’t going to want to work under those conditions.

So what would you say is a good balance?

On the side of doing a lot myself, I’m a programmer, and I can learn a lot of WP, but I might need site builders to help me with web-specific things and I might need a theme to help me be visually stylish.

On the side of hiring someone, I am cash poor so this has to be a fairly limited job, but I want to make the experience pleasant for them.

Under these conditions, do you think I could use WPBakery or similar, or would you still stay a thousand miles away from that?

You mention SITE LOAD SPEED, but I’m wondering if your reason to prefer underscores might be even more for the reason to create a clean slate for someone I hire.

Mike

Actually, it can be a paid theme, yes. I could use a paid site builder plugin if that’s better, as well. What do you recommend for a site builder plugin?

I guess I’m not very experienced customizing themes, but from what I can tell, I should probably start with a theme that’s not too far removed from what I’m aiming for, right?

And should I combine it with any special editor widgets?

Here’s what I’m thinking of:

mockup of site

Any free themes that look like this? That are responsive-ready?

thanks,
Mike

Thanks. You are right, in fact I hadn’t yet created a new database hostname. So I took care of that. I’ll wait for it to propagate, and try again in a few hours.

That’s not the only theme I use, I also use 2017. Although the text is not gray in 2017, I’m interested in learning about styling the visual editor in general. I looked at this article:

visual editor styling guide

Can you at least tell me if this is the right way to style the visual editor? The thing I’m not sure about is that this article refers to “TinyMCE” and I don’t know what that is.

EDIT: okay I think I figured out the above. This guide did seem to be mostly correct; the thing I had to do was style the html .mceContentBody element.

Also as far as the text color as it appears when rendered in the browser, I’m interested in learning in general how WordPress themes work. Is there some general element to use in the additional CSS, like p { color: black; } for styling ordinary text? Or is that always theme-dependent?

• This reply was modified 7 years, 11 months ago by michaelmossey.
• This reply was modified 7 years, 11 months ago by michaelmossey.

It’s from organicthemes.com,and it’s called “origin”

It sounds like you are speaking from the perspective of an expert who has developed an efficient approach after completing many projects.

I am a beginner and have many questions about how I’m going to organize my site. It’s primarily an educational site, like a book–it’s like writing a book, except that things will be linked together so pages don’t have to be read in a linear fashion. I don’t know how to produce a site map because I have much to learn about what content to include and how to organize it.

Yet, I need a bare bones version running soon. I can’t wait to finish the content, fully fleshed out according to my big vision.

As I learn how WordPress works, I may eventually change how I’m organizing the site, perhaps getting new ideas from the ways that information can be displayed and linked. What previously was split among three pages may become viable on one page, or vice-versa.

That worked! thanks