Problems with Wordpress

[TacoCat]

This is driving me insane...

FYI I'm using BuSo lightning theme.

Now, I'm no Wordpress expert and if I'm doing something noobishly wrong, don't be afraid to point it out.

But I'm having issues with everything. Never experienced anything like this before.

Lets start with something as simple as paragraphs. When I add text in the visual editor, it doesn't create paragraphs, just plain text, if I look into the "Text" tab, it doesn't create <p> tags, is this something wrong in my wordpress instalation or is it a thing of the theme?

Images.

If I add image and add size atributes, it sizes correctly, but the minute I add more text, it auto resizes to full width and ignores the size parametrs.

Second issue is that I can't seem to get the text wrap around the image. It just doesn't work. I'm not new to HTML or CSS.

Editing pages

How do you format the page itself? Can you add HTML and CSS into the "Text" tab? If the answer is yes, then my next question is how? Because you can't use style tags, the text editor adds <br/> after everything.

I'm super confused, can someone help me out?

 

[Nat]

Lets start with something as simple as paragraphs. When I add text in the visual editor, it doesn't create paragraphs, just plain text, if I look into the "Text" tab, it doesn't create <p> tags, is this something wrong in my wordpress instalation or is it a thing of the theme?

When you publish or preview a page, are they showing up? Not sure about this one...

Images.

If I add image and add size atributes, it sizes correctly, but the minute I add more text, it auto resizes to full width and ignores the size parametrs.

Second issue is that I can't seem to get the text wrap around the image. It just doesn't work. I'm not new to HTML or CSS.

This is because BuSoL 100%s all images to full width. Go into your child theme and add some CSS, top of my head... like the following

img.lgimg{
    width: auto;
    height: auto;
    padding-bottom: 15px;
    padding-top: 15px;
    max-width: 400px;
}

Then add class="lgimg" to the image in the post. The max-width will keep all the images that width. You can make multiple for the sizes you want to regularly use.
You can also delete the 100% CSS if you want, or override in another way.

Editing pages
How do you format the page itself? Can you add HTML and CSS into the "Text" tab? If the answer is yes, then my next question is how? Because you can't use style tags, the text editor adds <br/> after everything.

I think reading this will help you out a lot: https://developer.wordpress.org/themes/template-files-section/page-templates/
You can make a new template for each post if you really want to change page structure... You can add HTML in the text part of the visual editor. For CSS, make a child theme and add your css there and then use the class/ids.

 

[TacoCat]

Thanks, the image CSS worked great. I just thought, that you can override it if you add style to the IMG element itself.

The paragraph thing is no biggie, I just have to manually create every paragraph even in the Visual editor. Usualy they created themselves whenever I pressed enter.

But your answer @Nat basically solved my problems. Thanks for that.

 

[Ryuzaki]

Lets start with something as simple as paragraphs. When I add text in the visual editor, it doesn't create paragraphs, just plain text, if I look into the "Text" tab, it doesn't create <p> tags, is this something wrong in my wordpress instalation or is it a thing of the theme?

Wordpress never shows the <p> tags in the text editor. It inserts them based on how you structure your line breaks.

You should be seeing more than plain text in the visual editor. Check to make sure this is in your functions.php (should be on default install):

// Add Editor Style
add_editor_style( 'style.css' );

That links the visual editor to the CSS sheet so you can see what the text will actually look like.

How do you format the page itself? Can you add HTML and CSS into the "Text" tab? If the answer is yes, then my next question is how? Because you can't use style tags, the text editor adds <br/> after everything.

You can add HTML & CSS into the text editor. I do it all of the time. I have seen this issue before though. It would happen when changing back and forth from Text to Visual editor. But it stopped happening many Wordpress versions ago for me.

I snagged this from StackExchange:

remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );

function wpse_wpautop_nobr( $content ) {
    return wpautop( $content, false );
}

add_filter( 'the_content', 'wpse_wpautop_nobr' );
add_filter( 'the_excerpt', 'wpse_wpautop_nobr' );

I used similar solutions in the past to stop <br /> tags from being added. Again, I haven't needed to in a long time. If you used an auto-installer, I'd make sure your Wordpress is up to the newest version.

Second issue is that I can't seem to get the text wrap around the image. It just doesn't work. I'm not new to HTML or CSS.

Something is definitely up with your install or some change made to the theme after installation. This is in the Lightning CSS:

.alignleft {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
}
.alignright {
    float: right;
    margin-left: 15px;
    margin-bottom: 15px;
}

Floating images is what allows the text to wrap around them by yanking them out of the flow.

 

[TacoCat]

Wordpress never shows the <p> tags in the text editor. It inserts them based on how you structure your line breaks.

You should be seeing more than plain text in the visual editor. Check to make sure this is in your functions.php (should be on default install):

// Add Editor Style
add_editor_style( 'style.css' );

That links the visual editor to the CSS sheet so you can see what the text will actually look like.



You can add HTML & CSS into the text editor. I do it all of the time. I have seen this issue before though. It would happen when changing back and forth from Text to Visual editor. But it stopped happening many Wordpress versions ago for me.

I snagged this from StackExchange:

remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );

function wpse_wpautop_nobr( $content ) {
    return wpautop( $content, false );
}

add_filter( 'the_content', 'wpse_wpautop_nobr' );
add_filter( 'the_excerpt', 'wpse_wpautop_nobr' );

I used similar solutions in the past to stop <br /> tags from being added. Again, I haven't needed to in a long time. If you used an auto-installer, I'd make sure your Wordpress is up to the newest version.



Something is definitely up with your install or some change made to the theme after installation. This is in the Lightning CSS:

.alignleft {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
}
.alignright {
    float: right;
    margin-left: 15px;
    margin-bottom: 15px;
}

Floating images is what allows the text to wrap around them by yanking them out of the flow.

I know that it won't create the <p> tags in the text editor, but under the visual tab, if I press enter, shouldn't it create it as a new Paragraph? Every time I want a new paragraph now I have to switch to "Text" and add it manualy, because pressing enter in the visual editor does nothing.

I added sytle.min.css and that worked.

The code about pages, do you add it in the functions.php ?