Forum Replies Created

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter stuart20

    (@stuart20)

    cf7 plugin assigns unique classes to field wrappers,

    .wpcf7-form-control-wrap.<your-field-name>
    so you don’t need an IDs as each field has a unique name and that is used to construct the class.

    Okay, so what is the field name for just the address section?

    With the following CSS code, I can make the map and address smaller and float left, but it applies changes to both the map and the address section. How do I call just the address section and just the map section within the field ‘my_map’?

    CSS

    .wpcf7-form-control-wrap.my_map{
    	display: inline;
    	width: 45%;
      float: left;
    }

    HTML/ CF7
    [map* my_map show_address “zoom:4;clat:-38.366664084361826;clng:35.73023504724712;lat:-35.786595063131884;lng:38.280644136047357”]

    Thread Starter stuart20

    (@stuart20)

    thanks, do leave a review when you have 2 minutes of spare.

    Done 🙂

    Thread Starter stuart20

    (@stuart20)

    Confirmed now working with v1.4.5 -thanks

    Thread Starter stuart20

    (@stuart20)

    Thank you for the reply.

    – alternatively, display inline and float the google map element left and display inline the address field container using CSS styling

    In order to display inline and float with CSS, I assume the map and address need to be assigned to ids/classes. Using the inbuilt contact form 7 generated code:

    [map map-911 id:my_id_tag show_address "zoom:3;clat:0;clng:79.810600;lat:12.007089;lng:79.810600"]

    With the above code, the address bar does not display. The code seems to crash when it gets to id:my_id_tag. I’ve also tried assigning ‘map-911’ and/or ‘show address’ to ids/classes using normal html (id=”map-911″), but does not work either.

    We changed the above piece of code to the below, which then displays the show_address properly, but we cannot seem to get the ‘id:my_id_tag’ to work with our CSS code.
    [map map-911 show_address id:my_id_tag "zoom:3;clat:0;clng:79.810600;lat:12.007089;lng:79.810600"]

    Our final code looked as follow, but did not change anything on the display:

    Code in the contact form
    [map map-911 show_address id:my_id_tag "zoom:3;clat:0;clng:79.810600;lat:12.007089;lng:79.810600"]

    Code in the CSS editor

    #my_id_tag {
        display: inline;
        float: left;
    }
Viewing 4 replies - 1 through 4 (of 4 total)