Post Layout – Custom Theme

  • Resolved jemcbade

    (@jemcbade)


    5 years, 2 months ago

    I have been learning how to code my own themes and I have hit a snag. I have create themes before WP v5 and not seen this.

    I think it may be SOMEWHERE in the css or a linked CSS file. Other themes – starter themes (most of them) don’t do this, but I seem to be missing something in the css?

    Now to demonstrate the issue, I have created a VERY simple test theme and put it on a test site where you can see the behavior. On the backend (using either classic editor or the Gutenberg), it lays out fine. Yeah I am using the click on the image and select align left with text wrap around so ….

    But when a custom template is used I get a layout that looks like what is on my WP Sandbox. (See link above)

    Help appreciated in advance

    • This topic was modified 5 years, 2 months ago by jemcbade.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter jemcbade

    (@jemcbade)

    Ok, it seems that I have to individually style classes that are added to the tags that the editor generates.

    So am I presuming correctly that I need to test and style “ALL” classes that the editor adds to the tags?

    I guess these are all defined in a css file I should create for my purposes along the lines of a “editor-style.css” then?

    Sorry if this seems obvious but I thought the editor code had intrinsic default styles.
    ?

    It looks like your theme does not have the css to define the default WP classes.

    Is this what you are shooting for? https://prnt.sc/p4fbcp

    Add this to your css

    .alignleft {
    float: left;
    padding-right: 20px;
    }

    .alignright {
    float: right;
    padding-right: 20px;
    }

    Thread Starter jemcbade

    (@jemcbade)

    @jaycbrf Yes I saw that finally.

    The presumption I had made was that the editors had some basic default styles they would pass to the frontpage side of the equation, that would to some basic level, reflect the editor “backend” preview. This is simply not the case.

    As I go from starting with other existing template code, to coding from scratch, I see now I must maintain and enqueue something like the standard “editor-style.css” (for classic editor) and “editor-blocks” for Gutenberg editing.

    I think I have a handle on this now, but I detail it here for others combing the forums for answers.

    Thank you for taking the time to confirm my understanding.

    Kind regards,

    -John

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Post Layout – Custom Theme’ is closed to new replies.